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>
当前回答
我稍微调整了一下这个答案，然后想出了这个小提琴。
过滤器定义为:
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>
其他回答
对于那些刚接触angularjs的人。 可以使用$index获取索引。
例如:
<div ng-repeat="n in [] | range:10">
do something number {{$index}}
</div>
这将，当你使用Gloopy的方便滤镜，打印: 做一些0的事情 做第一件事 做第二件事 做第三件事 做第4件事 做第5件事 做第6件事 做第7件事 做第8件事 做第九件事
<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中实现这一点，而不需要任何控制器或工厂。
嗨，你可以使用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>
这是最简单的变体: 只需使用整数数组....
< lig repeat= < n >测试:
在控制器中设置作用域
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>
