分组重复项目

Question

我有一系列的项目items.

我想使用ng-repeat指令或类似的东西将n项目组合在一起.例如:

我希望items=['a', 'b', 'c', 'd', 'e', 'f', 'g']以3个为一组进行渲染,以呈现为:

<div class="row">
   <div class="col-sm-4">a</div>
   <div class="col-sm-4">b</div>
   <div class="col-sm-4">c</div>
</div>
<div class="row">
   <div class="col-sm-4">d</div>
   <div class="col-sm-4">e</div>
   <div class="col-sm-4">f</div>
</div>
<div class="row">
   <div class="col-sm-4">g</div>
</div>

我知道我可以做一些处理转items成items=[['a', 'b', 'c'], ['d', 'e', 'f'], ['g']],但是我在想,如果有anuglarjs支持来解决这个问题.可以？如果没有,你会怎么做呢？

提前致谢.

Answer 1

你可以像这样使用`ng-repeat'..

<div ng-controller="MyCtrl">
    <div ng-repeat="item in items">
        <span ng-switch on="$index % 3">
            <span ng-switch-when="0">
                <div class="row">
                    <div class="col-sm-4" ng-show="items[$index+0]">{{items[$index+0]}}</div>
                    <div class="col-sm-4" ng-show="items[$index+1]">{{items[$index+1]}}</div>
                    <div class="col-sm-4" ng-show="items[$index+2]">{{items[$index+2]}}</div>
                </div>
            </span>
        </span>
    </div>
</div>

演示:http://bootply.com/86855