我正在试图找出如何使用ng-repeat指令使用带有angular.js的行流动动态创建引导行div.
这是有棱角的：
<div ng-repeat="task in tasks" class="row-fluid">
<div class="span6 well">{{task.name}}</div>
</div>
这不行.我想生成的bootstrap html是：
基本上我需要在ng-repeat里面做mod 2的索引,如果是0,关闭< / div>并创建一个新的< div class =“row-fluid”>.这怎么可能？
解决方法
这个想法是过滤您的项目,以便对它们进行分组,并进行第二个ngRepeat来迭代子项目.
首先,将该过滤器添加到您的模块中：
module.filter('groupBy',function() {
return function(items,groupedBy) {
if (items) {
var finalItems = [],thisGroup;
for (var i = 0; i < items.length; i++) {
if (!thisGroup) {
thisGroup = [];
}
thisGroup.push(items[i]);
if (((i+1) % groupedBy) === 0) {
finalItems.push(thisGroup);
thisGroup = null;
}
}
if (thisGroup) {
finalItems.push(thisGroup);
}
return finalItems;
}
};
});
在你的控制器中(因为如果你直接在模板中过滤,那么你将有一个$digest loop)：
function TaskCtrl() {
$scope.tasksGroupBy2 = $filter('groupBy')(taskGroup,2);
}
在你的.html中：
<div ng-repeat="taskGroup in tasksGroupBy2" class="row-fluid">
<div ng-repeat="task in taskGroup" class="span6 well">{{task.name}}</div>
</div>
