AngularJS和ngRepeat - 每n次重複插入一個附加元素

Question

我想創建一個每隔7個重複div都有一個插入額外div的結構。這個div必須屬於父母，而不是其中一個重複div的孩子。

僅僅改變類是不夠的，整個內容將會不同並且完全不同ngShow邏輯將與附加div一起使用。

因此，例如：

<div id="parent"> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="special-child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="special-child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="special-child"></div> 
</div> 

這個例子使用的div的具體數量，ngRepeat可以是任何數字。同樣重要的是最後的結果的ngRepeat放入後，一個額外的div，即使它不是7

的整數倍我使用的電流ngRepeat邏輯是：

<div id="parent"> 
    <div class="child" ng-repeat="o in data"></div> 
    <div class="special-child"></div> 
</div> 

但是這不能正常工作，因爲額外的div只在所有重複的div之後插入一次。

更新與工作示例

<div id="parent"> 
    <div class="child" ng-repeat-start="o in data"></div> 
    <div class="special-child" ng-if="($index + 1) % 7 == 0 || $last" ng-repeat-end></div> 
</div> 

該解決方案需要AngularJS 1.2+

Answer 1

你需要這個東西接近：

<div ng-repeat="o in data"> 
    <div class="child"></div> 
    <div ng-if="$index % 7 == 0" class="special-child"></div> 
</div>