显示AngularJS中的列表按钮



我想添加一个按钮

if array.length! = 0

我写的东西不起作用。

$scope.pages = 0;
if(array.length != 0) {
   $scope.pages++;
}

,在我制作的angularjs中:

  <div ng-repeat="page in pages">
    <button ng-click="loadProducts(1)">{{ page }}</button>
  </div>

我认为在Angularjs中不能在数字之后,重复按钮

我认为您需要这个,

 <div ng-repeat="i in loadProducts(pages) track by $index">

演示

var myApp = angular.module('ReqWebApp', [])
myApp.controller('ReqAppController', function ReqAppController($scope) {
$scope.pages = 4;
$scope.loadProducts = function(num) {
    return new Array(num);   
}
});
<!DOCTYPE html>
<html ng-app="ReqWebApp">
<head>
    <meta charset="UTF-8">
    <title>New Request</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body ng-controller="ReqAppController">
    <div ng-repeat="page in loadProducts(pages) track by $index">
    <button>test{{ page }}</button>
  </div>
</body>
</html>

如果要创建按钮列表,请执行以下操作:

JS

  $scope.pages = 0;
    $scope.pageArray=[];
    if(array.length != 0) {
     for(var i=0;i<array.length;i++){
       $scope.pages++;
       $scope.pageArray.push($scope.pages);
    }
    }

html

<div ng-repeat="page in pageArray">
    <button ng-click="loadProducts($index)">{{ page }}</button>
 </div>

JS小提琴:http://jsfiddle.net/5dybgrvv/

,或者您可以在不向控制器添加内容的情况下进行操作,例如:

var myApp = angular.module('myApp', []);
function MyCtrl($scope) {
  $scope.number = 10;
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
  <div ng-repeat="x in [].constructor(number) track by $index">
    <button ng-click="loadProducts(1)">{{ $index }}</button>
  </div>
</div>

最新更新