插入行有兩列每四個NG重複值

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

基本上你需要使用內置在跟蹤該指數$指數是目前。每第四項意味着它應該可以被四整除。您還需要一個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>