Angularjs 如何使用两个ng重复来迭代可能具有不同长度的数组?
我有一个ng重复,还有一个ng重复,里面是这样的:Angularjs 如何使用两个ng重复来迭代可能具有不同长度的数组?,angularjs,Angularjs,我有一个ng重复,还有一个ng重复,里面是这样的: <div ng-repeat="i in [0,1,2,3,4]"> <div ng-repeat="j in [0,1,2,3,4,5,6,7,8,9]" ng-init="row=qs[i * 10 + j + 1]'"> <div ng-click="getQuestion(row.number)"> {{ row.number }}
<div ng-repeat="i in [0,1,2,3,4]">
<div ng-repeat="j in [0,1,2,3,4,5,6,7,8,9]" ng-init="row=qs[i * 10 + j + 1]'">
<div ng-click="getQuestion(row.number)">
{{ row.number }}
</div>
</div>
</div>
{{row.number}}
代码遍历数组qs
的50个成员,该数组在加载到此处的控制器中的my$scope上定义。上面的代码很好地创建了5行10个
来保存每个数组元素的详细信息
然而,qs数组可能只有2个、12个、20个或任意数量的元素。如果是两个元素,我希望有一行两个
s。如果是12,我希望有一行10个
s,在两个
s下面有一行
是否有一种方法可以使此代码更灵活,以便它能够处理不同的数组长度?特别是我意识到,例如,我可以取数组长度,如果它是25,那么我知道我必须让我的ng重复通过
[0,1,2]
,但是如何从25创建[0,1,2]
?您可以创建一个简单的过滤器,根据提供的长度生成数组
.filter('range', function() {
return function(input, range) {
if (range < 1) return [];
return Array.apply(null, {
length: range
}).map(Number.call, Number);
}
});
.filter('range',function(){
返回功能(输入、范围){
如果(范围<1)返回[];
返回数组.apply(null{
长度:范围
}).map(Number.call,Number);
}
});
把它当作:-
<div ng-repeat="i in []|range:qns.length/10">
angular.module('app',[]).controller('ctrl',function($scope){
$scope.count=100;
})
.filter('范围',函数()){
返回功能(输入、范围){
如果(范围<1)返回[];
返回数组.apply(null{
长度:范围
}).map(Number.call,Number);
}
});代码>
嘿
使用控制器,将阵列作为作用域属性放置在控制器中,然后您将拥有.length
。抱歉。也许我的问题不太清楚,我只有一个叫做qs的数组,它的长度应该是qs.length。我只需要对数组qs做一次,你不能遍历qns数组吗?为什么所有这些都会映射你的初始数组来嵌套数据。似乎您的问题是数据结构,而不是如何使用ng repeat。提供一个带有示例的演示data@Alan为什么不在控制器中相应地转换视图模型,而不是在视图中进行转换?这有点不清楚,你有演示吗?谢谢-我会看看这个