是否有一种方法可以ng-repeat定义的次数,而不是总是要迭代一个数组?

例如,下面我希望列表项显示5次,假设为$scope。数字等于5,加上增加的数字,所以每个列表项都增加,如1,2,3,4,5

预期的结果:

<ul>
   <li><span>1</span></li>
   <li><span>2</span></li>
   <li><span>3</span></li>
   <li><span>4</span></li>
   <li><span>5</span></li>
</ul>

当前回答

下面是一个如何做到这一点的例子。请注意,我的灵感来自ng-repeat文档中的一个注释:http://jsfiddle.net/digitalzebra/wnWY6/

注意ng-repeat指令:

<div ng-app>
    <div ng-controller="TestCtrl">
        <div ng-repeat="a in range(5) track by $index">{{$index + 1}}</div>
    </div>
</div>

这是控制器:

function TestCtrl($scope) {
    $scope.range = function(n) {
        return new Array(n);
    };
};

其他回答

这只是对公认答案的轻微变化,但实际上不需要创建新函数。仅在作用域中导入Array:

<div ng-app="myapp">
    <div ng-controller="ctrlParent">
        <ul>
            <li ng-repeat="i in counter(5) track by $index">
              <span>{{$index+1}}</span></li>
        </ul>
    </div>
</div>
var app = angular.module('myapp',[]);
app.controller('ctrlParent',function($scope){
    $scope.myNumber = 5;
    $scope.counter = Array;
});

这把小提琴就是一个活生生的例子。

我也遇到过同样的问题,这就是我得出的结论:

(function () {
  angular
    .module('app')
    .directive('repeatTimes', repeatTimes);

  function repeatTimes ($window, $compile) {
    return { link: link };

    function link (scope, element, attrs) {
      var times    = scope.$eval(attrs.repeatTimes),
          template = element.clone().removeAttr('repeat-times');

      $window._(times).times(function (i) {
        var _scope = angular.extend(scope.$new(), { '$index': i });
        var html = $compile(template.clone())(_scope);

        html.insertBefore(element);
      });

      element.remove();
    }
  }
})();

... 和html:

<div repeat-times="4">{{ $index }}</div>

生活的例子

我使用了下划线的时间函数,因为我们已经在项目中使用它,但你可以很容易地用本地代码替换它。

下面是angular 1.2.x的答案

基本上是一样的,只是稍微修改了ng-repeat

<li ng-repeat="i in getNumber(myNumber) track by $index">

这是小提琴:http://jsfiddle.net/cHQLH/153/

这是因为angular 1.2不允许在指令中重复值。这意味着如果您尝试执行以下操作,将会得到一个错误。

<li ng-repeat="x in [1,1,1]"></li>

我认为这个jsFiddle从这个线程可能是你正在寻找的。

<div ng-app ng-controller="Main">
   <div ng-repeat="item in items | limitTo:2">
       {{item.name}}
   </div>
</div>

你可以使用ng-if指令和ng-repeat

因此,如果num是元素需要重复的次数:

<li ng-repeat="item in list" ng-if="$index < num">