Angular确实为在HTML指令中使用数字的for循环提供了一些支持：
<div data-ng-repeat="i in [1,2,3,4,5]">
do something
</div>
但是如果你的范围变量包含一个具有动态数字的范围，那么你每次都需要创建一个空数组。
在控制器中
var range = [];
for(var i=0;i<total;i++) {
range.push(i);
}
$scope.range = range;
在HTML
中<div data-ng-repeat="i in range">
do something
</div>
这是有效的，但是没有必要，因为我们不会在循环中使用范围数组。有没有人知道为最小/最大值设置范围或常规？
类似的东西：
<div data-ng-repeat="i in 1 .. 100">
do something
</div>
答案 0 :(得分：271)
我稍微调整了this answer并提出了this fiddle。
过滤器定义为：
var myApp = angular.module('myApp', []);
myApp.filter('range', function() {
return function(input, total) {
total = parseInt(total);
for (var i=0; i<total; i++) {
input.push(i);
}
return input;
};
});
使用这样的重复：
<div ng-repeat="n in [] | range:100">
do something
</div>
答案 1 :(得分：144)
我提出了一个更简单的版本，用于创建两个定义数字之间的范围，例如。 5到15
<强> HTML ：
<ul>
<li ng-repeat="n in range(5,15)">Number {{n}}</li>
</ul>
<强>控制器：
$scope.range = function(min, max, step) {
step = step || 1;
var input = [];
for (var i = min; i <= max; i += step) {
input.push(i);
}
return input;
};
答案 2 :(得分：86)
只有普通的Javascript（你甚至不需要控制器）：
<div ng-repeat="n in [].constructor(10) track by $index">
{{ $index }}
</div>
在模拟时非常有用
答案 3 :(得分：69)
我想出了一个略微不同的语法，它更适合我，并添加了一个可选的下限：
myApp.filter('makeRange', function() {
return function(input) {
var lowBound, highBound;
switch (input.length) {
case 1:
lowBound = 0;
highBound = parseInt(input[0]) - 1;
break;
case 2:
lowBound = parseInt(input[0]);
highBound = parseInt(input[1]);
break;
default:
return input;
}
var result = [];
for (var i = lowBound; i <= highBound; i++)
result.push(i);
return result;
};
});
可以用作
<div ng-repeat="n in [10] | makeRange">Do something 0..9: {{n}}</div>
或
<div ng-repeat="n in [20, 29] | makeRange">Do something 20..29: {{n}}</div>
答案 4 :(得分：31)
对于那些刚接触到angularjs的人。 可以使用$ index来获取索引。
例如：
<div ng-repeat="n in [] | range:10">
do something number {{$index}}
</div>
当您使用Gloopy的便捷过滤器时，将打印：
做一些数字0
做第1件事
做第2件事
做第3件事
做点什么4
做第5件事
做第6件事
做第7号事
做第8件事
做点什么9
答案 5 :(得分：21)
这样做的一个简单方法是使用Underscore.js的_.range（）方法。 ：）
http://underscorejs.org/#range
// declare in your controller or wrap _.range in a function that returns a dynamic range.
var range = _.range(1, 11);
// val will be each number in the array not the index.
<div ng-repeat='val in range'>
{{ $index }}: {{ val }}
</div>
答案 6 :(得分：20)
我使用自定义ng-repeat-range指令：
/**
* Ng-Repeat implementation working with number ranges.
*
* @author Umed Khudoiberdiev
*/
angular.module('commonsMain').directive('ngRepeatRange', ['$compile', function ($compile) {
return {
replace: true,
scope: { from: '=', to: '=', step: '=' },
link: function (scope, element, attrs) {
// returns an array with the range of numbers
// you can use _.range instead if you use underscore
function range(from, to, step) {
var array = [];
while (from + step <= to)
array[array.length] = from += step;
return array;
}
// prepare range options
var from = scope.from || 0;
var step = scope.step || 1;
var to = scope.to || attrs.ngRepeatRange;
// get range of numbers, convert to the string and add ng-repeat
var rangeString = range(from, to + 1, step).join(',');
angular.element(element).attr('ng-repeat', 'n in [' + rangeString + ']');
angular.element(element).removeAttr('ng-repeat-range');
$compile(element)(scope);
}
};
}]);
和html代码是
<div ng-repeat-range from="0" to="20" step="5">
Hello 4 times!
</div>
或只是
<div ng-repeat-range from="5" to="10">
Hello 5 times!
</div>
甚至只是
<div ng-repeat-range to="3">
Hello 3 times!
</div>
或只是
<div ng-repeat-range="7">
Hello 7 times!
</div>
答案 7 :(得分：9)
最简单的没有代码解决方案是使用范围初始化一个数组，并使用$ index +但是我想要偏移的数量：
<select ng-init="(_Array = []).length = 5;">
<option ng-repeat="i in _Array track by $index">{{$index+5}}</option>
</select>
答案 8 :(得分：7)
下面的代码定义了一个方法range()，可用于整个应用程序范围MyApp。它的行为与Python range()方法非常相似。
angular.module('MyApp').run(['$rootScope', function($rootScope) {
$rootScope.range = function(min, max, step) {
// parameters validation for method overloading
if (max == undefined) {
max = min;
min = 0;
}
step = Math.abs(step) || 1;
if (min > max) {
step = -step;
}
// building the array
var output = [];
for (var value=min; value<max; value+=step) {
output.push(value);
}
// returning the generated array
return output;
};
}]);
使用一个参数：
<span ng-repeat="i in range(3)">{{ i }}, </span>
0, 1, 2,
有两个参数：
<span ng-repeat="i in range(1, 5)">{{ i }}, </span>
1, 2, 3, 4,
有三个参数：
<span ng-repeat="i in range(-2, .7, .5)">{{ i }}, </span>
-2, -1.5, -1, -0.5, 0, 0.5,
答案 9 :(得分：6)
您可以在angular.filter模块中使用'after'或'before'过滤器（https://github.com/a8m/angular-filter）
$scope.list = [1,2,3,4,5,6,7,8,9,10]
<强> HTML
<li ng-repeat="i in list | after:4">
{{ i }}
</li>
<强>结果： 5,6,7,8,9,10
答案 10 :(得分：5)
您的控制器没有任何变化，您可以使用：
ng-repeat="_ in ((_ = []) && (_.length=51) && _) track by $index"
享受！
答案 11 :(得分：3)
JS（在你的AngularJS控制器中）
$scope.range = new Array(MAX_REPEATS); // MAX_REPEATS should be the most repetitions you will ever need in a single ng-repeat
<强> HTML
<div data-ng-repeat="i in range.slice(0,myCount) track by $index"></div>
...其中myCount是应该出现在此位置的星数。
您可以使用$index进行任何跟踪操作。例如。如果要在索引上打印一些变异，可以将以下内容放在div：
{{ ($index + 1) * 0.5 }}
答案 12 :(得分：2)
非常简单：
$scope.totalPages = new Array(10);
<div id="pagination">
<a ng-repeat="i in totalPages track by $index">
{{$index+1}}
</a>
</div>
答案 13 :(得分：2)
使用UnderscoreJS：
angular.module('myModule')
.run(['$rootScope', function($rootScope) { $rootScope.range = _.range; }]);
将此应用于$rootScope会使其随处可用：
<div ng-repeat="x in range(1,10)">
{{x}}
</div>
答案 14 :(得分：2)
您好，您可以使用AngularJS使用纯HTML进行此操作（无需指令！）
<div ng-app="myapp" ng-controller="YourCtrl" ng-init="x=[5];">
<div ng-if="i>0" ng-repeat="i in x">
<!-- this content will repeat for 5 times. -->
<table class="table table-striped">
<tr ng-repeat="person in people">
<td>{{ person.first + ' ' + person.last }}</td>
</tr>
</table>
<p ng-init="x.push(i-1)"></p>
</div>
</div>
答案 15 :(得分：1)
@ Mormegil解决方案的改进
app.filter('makeRange', function() {
return function(inp) {
var range = [+inp[1] && +inp[0] || 0, +inp[1] || +inp[0]];
var min = Math.min(range[0], range[1]);
var max = Math.max(range[0], range[1]);
var result = [];
for (var i = min; i <= max; i++) result.push(i);
if (range[0] > range[1]) result.reverse();
return result;
};
});
使用
<span ng-repeat="n in [3, -3] | makeRange" ng-bind="n"></span>
3 2 1 0 -1 -2 -3
<span ng-repeat="n in [-3, 3] | makeRange" ng-bind="n"></span>
-3 -2 -1 0 1 2 3
<span ng-repeat="n in [3] | makeRange" ng-bind="n"></span>
0 1 2 3
<span ng-repeat="n in [-3] | makeRange" ng-bind="n"></span>
0 -1 -2 -3
答案 16 :(得分：1)
在控制器中设置范围
var range = [];
for(var i=20;i<=70;i++) {
range.push(i);
}
$scope.driverAges = range;
在Html模板文件中设置重复
<select type="text" class="form-control" name="driver_age" id="driver_age">
<option ng-repeat="age in driverAges" value="{{age}}">{{age}}</option>
</select>
答案 17 :(得分：1)
我尝试了以下内容，它对我来说效果很好：
<md-radio-button ng-repeat="position in formInput.arrayOfChoices.slice(0,6)" value="{{position}}">{{position}}</md-radio-button>
Angular 1.3.6
答案 18 :(得分：1)
晚会。但我最终只是这样做了：
在您的控制器中：
$scope.repeater = function (range) {
var arr = [];
for (var i = 0; i < range; i++) {
arr.push(i);
}
return arr;
}
HTML：
<select ng-model="myRange">
<option>3</option>
<option>5</option>
</select>
<div ng-repeat="i in repeater(myRange)"></div>
答案 19 :(得分：1)
这是jzm的改进答案（我无法评论，否则我会评论她/他的答案，因为他/她包含错误）。 该函数具有开始/结束范围值，因此它更灵活，并且......它可以工作。这个特殊情况适用于每月的某一天：
README答案 20 :(得分：0)
我鞭打了它，看到它可能对某些人有用。 （是的，CoffeeScript。告诉我。）
app.directive 'times', ->
link: (scope, element, attrs) ->
repeater = element.html()
scope.$watch attrs.times, (value) ->
element.html ''
return unless value?
element.html Array(value + 1).join(repeater)
使用：
<div times="customer.conversations_count">
<i class="icon-picture></i>
</div>
这可以变得更简单吗？
我对过滤器很谨慎，因为Angular总是喜欢重新评估它们，并且如果你像我一样拥有成千上万的人，那就是一个巨大的瓶颈。
该指令甚至会监视模型中的更改，并相应地更新元素。
答案 21 :(得分：0)
<div ng-init="avatars = [{id : 0}]; flag = true ">
<div ng-repeat='data in avatars' ng-if="avatars.length < 10 || flag"
ng-init="avatars.length != 10 ? avatars.push({id : $index+1}) : ''; flag = avatars.length <= 10 ? true : false">
<img ng-src="http://actual-names.com/wp-content/uploads/2016/01/sanskrit-baby-girl-names-400x275.jpg">
</div>
</div>
如果你想在没有任何控制器或工厂的情况下在html中实现这一点。
答案 22 :(得分：0)
假设$scope.refernceurl是一个数组，然后
for(var i=0; i<$scope.refernceurl.length; i++){
$scope.urls+=$scope.refernceurl[i].link+",";
}
答案 23 :(得分：-8)
这是最简单的变体： 只使用整数数组....
GMT