每四个ng-repeat值插入一行，每两列

Question

下面是用Html和AngularJS编写的代码：

<div class='row'>
    <div class='col-md-6' ng-repeat='post in news'>
        <div class='post-content'>{{ post.title }}</div>
    </div>
</div>

现在，我需要的是每四个帖子推入一个有两列的行。

<div class='row'>
    <div class='col-md-6'>
        <div class='add-content'>Something</div>
    </div>
    <div class='col-md-6'>
        <div class='add-content'>Something</div>
    </div>
</div>

如何在AngularJS中实现？

我正在寻找的DOM结果是：

<div class='row'>
    <div class='col-md-6'>
        <div class='post-content'>POST TITLE</div>
    </div>
    <div class='col-md-6'>
        <div class='post-content'>POST TITLE</div>
    </div>
    <div class='col-md-6'>
        <div class='post-content'>POST TITLE</div>
    </div>
    <div class='col-md-6'>
        <div class='post-content'>POST TITLE</div>
    </div>
</div>
<div class='row'>
    <div class='col-md-6'>
       <div class='add-content'>Something</div>
    </div>
    <div class='col-md-6'>
        <div class='add-content'>Something</div>
    </div>
</div>
<div class='row'>
    <div class='col-md-6'>
        <div class='post-content'>POST TITLE</div>
    </div>
    <div class='col-md-6'>
        <div class='post-content'>POST TITLE</div>
    </div>
...

Answer 1

本质上，您需要使用内置的$index，它可以跟踪它当前所在的索引。每四项意味着它应该被四整除。您还需要一个ng-if语句来确定是否应该在所述项目上添加dom代码片段。此外，这需要使用ng-repeat-start而不是ng-repeat。它很少使用，但为了这个目的，它应该可以工作。代码如下：

   <div class='row' ng-repeat-start="post in news" >
      <div class='post-content'>{{ post.title }}</div>
   </div> 
   <div class="row" ng-repeat-end  ng-if="($index +1 ) % 4 === 0" >
      <div class='col-md-6'>
        <div class='post-content'>POST TITLE</div>
      </div>
      <div class='col-md-6'>
        <div class='post-content'>POST TITLE</div>
      </div>
   </div>