有没有一种方法可以ng-repeat定义次数，而不必总是遍历数组？
例如，在下面，我希望列表项显示 5 次，假设$scope.number等于 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>
较新版本的 AngularJS (>= 1.3.0) 允许您仅使用一个变量来执行此操作（不需要函数）：
<li ng-repeat="x in [].constructor(number) track by $index">
<span>{{ $index+1 }}</span>
</li>
$scope.number = 5;
这在第一次提出问题时是不可能的。归功于@Nikhil Nambiar，他对此更新的回答如下
目前，ng-repeat只接受一个集合作为参数，但你可以这样做：
<li ng-repeat="i in getNumber(number)">
<span>{{ $index+1 }}</span>
</li>
在你的控制器中的某个地方：
$scope.number = 5;
$scope.getNumber = function(num) {
return new Array(num);
}
这将允许您随意更改$scope.number为任何数字，并且仍然保持您正在寻找的绑定。
编辑（2014 年 1 月 6 日） ——较新版本的 AngularJS（>= 1.1.5）需要track by $index：
<li ng-repeat="i in getNumber(number) track by $index">
<span>{{ $index+1 }}</span>
</li>
getNumber这是使用相同功能的几个列表的小提琴。
你可以这样做：
<div ng-repeat="i in [1, 2, 3, 4]">
...
</div>
这是一个如何做到这一点的例子。请注意，我受到 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);
};
};
一种更简单的方法是（例如 5 次）：
<div ng-repeat="x in [].constructor(5) track by $index">
...
</div>
我遇到了同样的问题。我遇到了这个线程，但不喜欢他们在这里的方法。我的解决方案是使用我们已经安装的 underscore.js。就这么简单：
<ul>
<li ng-repeat="n in _.range(1,6)"><span>{{n}}</span></li>
</ul>
这将完全符合您的要求。
我想保持我的 html 非常小，所以定义了一个小过滤器来创建数组 [0,1,2,...]，就像其他人所做的那样：
angular.module('awesomeApp')
.filter('range', function(){
return function(n) {
var res = [];
for (var i = 0; i < n; i++) {
res.push(i);
}
return res;
};
});
之后，在视图上可以这样使用：
<ul>
<li ng-repeat="i in 5 | range">
{{i+1}} <!-- the array will range from 0 to 4 -->
</li>
</ul>
这真的很丑陋，但它可以在没有控制器的情况下用于整数或变量：
整数：
<span ng-repeat="_ in ((_ = []) && (_.length=33) && _) track by $index">{{$index}}</span>
多变的：
<span ng-repeat="_ in ((_ = []) && (_.length=myVar) && _) track by $index">{{$index}}</span>
有很多方法可以做到这一点。我真的很担心控制器中的逻辑，所以我创建了一个简单的指令来解决重复元素 n 次的问题。
安装：
该指令可以使用安装bower install angular-repeat-n
例子：
<span ng-repeat-n="4">{{$index}}</span
产生：1234
它也可以使用范围变量：
<span ng-repeat-n="repeatNum"></span>
来源：
这只是对已接受答案的微小变化，但您实际上并不需要创建新函数。仅在范围内导入“数组”：
<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;
});
请参阅此小提琴以获取实时示例。
JS（在你的 AngularJS 控制器中）
$scope.range = new Array(MAX_REPEATS); // set MAX_REPEATS to the most repetitions you will ever need in a single ng-repeat that makes use of this strategy
HTML
<div ng-repeat="i in range.slice(0,repeatCount) track by $index"></div>
...哪里repeatCount是应该出现在这个位置的重复次数。
angular 提供了一个非常漂亮的函数，称为slice .. 使用它你可以实现你想要的。 例如 ng-repeat="abc.slice(startIndex,endIndex)"
这个演示： http: //jsfiddle.net/sahilosheal/LurcV/39/将帮助您并告诉您如何使用这个“让生活更轻松”的功能。:)
html:
<div class="div" ng-app >
<div ng-controller="Main">
<h2>sliced list(conditional NG-repeat)</h2>
<ul ng-controller="ctrlParent">
<li ng-repeat="ab in abc.slice(2,5)"><span>{{$index+1}} :: {{ab.name}} </span></li>
</ul>
<h2>unsliced list( no conditional NG-repeat)</h2>
<ul ng-controller="ctrlParent">
<li ng-repeat="ab in abc"><span>{{$index+1}} :: {{ab.name}} </span></li>
</ul>
</div>
CSS：
ul
{
list-style: none;
}
.div{
padding:25px;
}
li{
background:#d4d4d4;
color:#052349;
}
ng-JS：
function ctrlParent ($scope) {
$scope.abc = [
{ "name": "What we do", url: "/Home/AboutUs" },
{ "name": "Photo Gallery", url: "/home/gallery" },
{ "name": "What we work", url: "/Home/AboutUs" },
{ "name": "Photo play", url: "/home/gallery" },
{ "name": "Where", url: "/Home/AboutUs" },
{ "name": "playground", url: "/home/gallery" },
{ "name": "What we score", url: "/Home/AboutUs" },
{ "name": "awesome", url: "/home/gallery" },
{ "name": "oscar", url: "/Home/AboutUs" },
{ "name": "american hustle", url: "/home/gallery" }
];
}
function Main($scope){
$scope.items = [{sort: 1, name: 'First'},
{sort: 2, name: 'Second'},
{sort: 3, name: 'Third'},
{sort: 4, name:'Last'}];
}
这是角度 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>
您可以将ng-if指令与ng-repeat
因此，如果 num 是您需要重复元素的次数：
<li ng-repeat="item in list" ng-if="$index < num">
对于使用 CoffeeScript 的用户，您可以使用范围推导：
指示
link: (scope, element, attrs) ->
scope.range = [1..+attrs.range]
或控制器
$scope.range = [1..+$someVariable]
$scope.range = [1..5] # Or just an integer
模板
<div ng-repeat="i in range">[ the rest of your code ]</div>
稍微扩展一下 Ivan 的第一个答案，只要字符是唯一的，您就可以使用字符串作为不带 track by 语句的集合，所以如果用例少于 10 个数字（因为它在问题中）我会只需这样做：
<ul>
<li ng-repeat="n in '12345'"><span>{{n}}</span></li>
</ul>
当然，这有点笨拙，但看起来很简单，而且不会特别令人困惑。
你可以使用这个例子。
内部控制器：
$scope.data = {
'myVal': 33,
'maxVal': 55,
'indexCount': function(count) {
var cnt = 10;
if (typeof count === 'number') {
cnt = count;
}
return new Array(cnt);
}
};
HTML 代码端的 select 元素示例：
<select ng-model="data.myVal" value="{{ data.myVal }}">
<option ng-repeat="i in data.indexCount(data.maxVal) track by $index" value="{{ $index + 1 }}">{{ $index + 1 }}</option>
</select>
首先，使用 LoDash 创建一个角度过滤器：
angular.module('myApp').filter('times', function(){
return function(value){
return _.times(value || 0);
}
});
LoDash 时间函数能够处理 null、未定义、0、数字和数字的字符串表示形式。
然后，在您的 HTML 中使用它，如下所示：
<span ng-repeat="i in 5 | times">
<!--DO STUFF-->
</span>
或者
<span ng-repeat="i in myVar | times">
<!--DO STUFF-->
</span>
和 2021 版本
*ngFor="let x of [].constructor(number)"
Angular 提供过滤器来修改集合。在这种情况下，集合将为空，即 []，并且过滤器也接受参数，如下所示：
<div id="demo">
<ul>
<li ng-repeat="not in []|fixedNumber:number track by $index">{{$index}}</li>
</ul>
</div>
JS：
module.filter('fixedNumber', function() {
return function(emptyarray, number) {
return Array(number);
}
});
module.controller('myCtrl', ['$scope', function($scope) {
$scope.number = 5;
}]);
这种方法与上面提出的方法非常相似，不一定优越，但显示了 AngularJS 中过滤器的强大功能。
如果 n 不是太高，另一种选择是使用 split('') 和 n 个字符的字符串：
<div ng-controller="MainCtrl">
<div ng-repeat="a in 'abcdefgh'.split('')">{{$index}}</div>
</div>
我遇到了同样的问题，这就是我得出的结论：
(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>
我使用了下划线的times功能，因为我们已经在项目中使用了它，但是您可以轻松地将其替换为本机代码。
我需要一个更动态的解决方案——我可以增加重复。
HTML
<div ng-repeat="n in newUserCount">
<input type="text" value="" name="newuser{{n}}"/>
</div>
复印机控制
<span class="helper" ng-click="duplicateUser()">
Create another user with the same permissions
</span>
JS
$scope.newUserCount = Array('1');
var primaryValue = 1;
$scope.duplicateUser = function()
{
primaryValue++;
$scope.newUserCount.push(primaryValue)
}
因为迭代一个字符串，它将为每个字符呈现一个项目：
<li ng-repeat = "k in 'aaaa' track by $index">
{{$index}} //THIS DOESN'T ANSWER OP'S QUESTION. Read below.
</li>
我们可以使用本机过滤器来使用这种丑陋但无代码的解决方法。number|n decimal places
<li ng-repeat="k in (0|number:mynumber -2 ) track by $index">
{{$index}}
</li>
这样我们将拥有mynumber没有额外代码的元素。说'0.000'。
我们mynumber - 2用来补偿0.
它不适用于 3 以下的数字，但在某些情况下可能有用。
我正在创建一个可重用的指令，其中最大数量将来自另一个 ng-repeat。因此，这是对最佳投票答案的编辑。
只需将控制器上的代码更改为 -
$scope.getNumber = function(num) {
var temp = [];
for(var j = 0; j < num; j++){
temp.push(j)
}
return temp;
}
这将返回一个具有指定迭代次数的新数组
$scope.number = 5;
<div ng-repeat="n in [] | range:$scope.number">
<span>{{$index}}</span>
</div>
简单的方法：
public defaultCompetences: Array<number> = [1, 2, 3];
在组件/控制器中，然后：
<div ng-repeat="i in $ctrl.defaultCompetences track by $index">
此代码来自我的打字稿项目，但可以重新排列为纯 javascript