1

我想在我的应用程序中创建一个段落视图，其中每 5 个项目显示在一个块中，一个在彼此下方，接下来的五个在下一个块中；

例子：

<div style="display:inline-block">
 <div style="display:inline-block">
   <div style="display:block">1.-----</div>
   <div style="display:block">2.-----</div>
   <div style="display:block">3.-----</div>
   <div style="display:block">4.-----</div>
   <div style="display:block">5.-----</div>
 </div>

 <div style="display:inline-block">
   <div style="display:block">6.-----</div>
   <div style="display:block">7.-----</div>
   <div style="display:block">8.-----</div>
   <div style="display:block">9.-----</div>
   <div style="display:block">10.-----</div>
 </div>
</div>

所以基本上我需要做一些丑陋的事情，比如 2 次嵌套迭代，一次推进 5 个元素，一次推进另一个 1 个元素。

或者在我使用的 Angular 版本中不可用的 ng-if 指令。

4

1 回答 1

1

从技术上讲，您可以使用一个ng-repeat来实现它（没有ng-if）。尝试这样的事情：

<div style="display:inline-block" ng-repeat="item in items">
    <div style="display:inline-block" ng-show="$index % 5 == 0">
        <div style="display:block">{{items[$index+0].content}}</div>
        <div style="display:block">{{items[$index+1].content}}</div>
        <div style="display:block">{{items[$index+2].content}}</div>
        <div style="display:block">{{items[$index+3].content}}</div>
        <div style="display:block">{{items[$index+4].content}}</div>
    </div>
</div>

演示：http: //jsfiddle.net/kpgbx/

于 2013-09-23T16:26:07.777 回答