Angular JS 使用 ng-repeat 进入 3，然后创建一个新行

Question

我正在尝试使用 ng-repeat 创建一个表，每行 3 个项目，然后创建一个新行，等等。

我正在使用 div span3，但它没有包装我的引导徽章。

任何帮助都会很棒。

谢谢

Answer 1

使用范围过滤器，您可以进行嵌套重复 - 内部计算行中的 3 个项目，外部计算行（即三个一组）：

<div class="row" ng-repeat="n in [] | range:(data.length/3)+1">
    <span ng-repeat='item in data.slice($index*3,($index*3+3))'>
        {{item}}
    </span>
</div>

还有associated range filter，它返回一个从0到指定参数的数组：

app.filter('range', function () {
  return function (input, total) {
    total = parseInt(total);
    for (var i = 0; i < total; i++) {
        input.push(i);
    }
    return input;
};