多次反复使用重复的AngularJS(Multiple Iterations with Angula

我搜索了一会儿，确实发现了很多关于多次迭代。问题是，我不明白我的问题一个简单的解决方案。

我有与NG-重复dinamically填充复选框的列表。由于布局的目的，我需要创建一个新div inline-block ，只要我达到3个复选框。像那样：

的CheckBoxList = {1,2,3,4,5}

<div class="form-group-content">
    <div class="form-col-secondary">
        <ul class="list-checkboxes">
            <li>
                <input type="checkbox"/>1                                           
            </li>
            <li>
                <input type="checkbox"/>2                                           
            </li>
            <li>
                <input type="checkbox"/>3                                           
            </li>
        </ul>
    </div>
    <div class="form-col-secondary">
        <ul class="list-checkboxes">
            <li>
                <input type="checkbox"/>4                                           
            </li>
            <li>
                <input type="checkbox"/>5                                           
            </li>
        </ul>
    </div>
</div>

我试图用一个迭代器和两个ng-repeat ，但没有工作像我想。

如果有人已经有了这种斗争，并有助于我将不胜感激。

Answer 1:

要做到这一点，你将不得不作出2次更新。

2，重复
结构变化

HTML代码

<div class="form-group-content">
    <div class="form-col-secondary" ng-repeat="block in blocks">
      <ul class="list-checkboxes">
            <li ng-repeat="checkbox in block">
                 <input type="checkbox{{$index + 1}}"/>  
            </li>
      </ul>
    </div>
</div>

JS代码

$scope.blocks = [
    ['1','2','3'],
    ['4','5']
    ];

这里是你plunker - http://plnkr.co/edit/BWcFI5d02yPkAYDiQxvO?p=preview

Answer 2:

如果您在零件拆分的3你的CheckBoxList，你可以在每个格使用您的NG-重复。因此，改变的CheckBoxList喜欢的东西：

divs = [[1,2,3],[4,5,6]];

那么你的HTML：

<div class="form-col-secondary" ng-repeat="div in divs">
    <ul class="list-checkboxes">
        <li ng-repeat="checkbox in div">
            <input type="checkbox" ng-attr-id="{{checkbox}}">
        </li>
    </ul>
</div>

这可能NOG精确匹配你想要的结果是什么，但它反映了你应该能够创建自己的工作版本的原理:-)

编辑

值得注意的是：据我所知，你不能有<input type="checkbox1" />我想你的意思<input type="checkbox" id="1" name="checkbox1" />代替。