是否有一种方法可以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>
当前回答
简单的方法:
public defaultCompetences: Array<number> = [1, 2, 3];
在组件/控制器中，然后:
<div ng-repeat="i in $ctrl.defaultCompetences track by $index">
这段代码来自我的typescript项目，但可以重新安排到纯javascript
其他回答
我想保持我的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>
Angular提供了一个非常可爱的函数slice..使用它你可以达到你想要的效果。 例如ng-repeat="ab in 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'}];
}
简单的方法:
public defaultCompetences: Array<number> = [1, 2, 3];
在组件/控制器中，然后:
<div ng-repeat="i in $ctrl.defaultCompetences track by $index">
这段代码来自我的typescript项目，但可以重新安排到纯javascript
你可以用这个例子。
在控制器:
$scope.data = {
'myVal': 33,
'maxVal': 55,
'indexCount': function(count) {
var cnt = 10;
if (typeof count === 'number') {
cnt = count;
}
return new Array(cnt);
}
};
在HTML代码端选择元素的例子:
<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>
在Ivan的第一个答案上展开一点，只要字符是唯一的，你可以使用一个字符串作为集合，而不使用track by语句，所以如果用例少于10个数字(就像在问题中那样)，我将简单地这样做:
<ul>
<li ng-repeat="n in '12345'"><span>{{n}}</span></li>
</ul>
当然，这有点古怪，但看起来足够简单，也不是特别令人困惑。
