AngularJS e ngRepeat - inserire un elemento aggiuntivo ogni n ripetizioni

Question

Sto provando a creare una struttura in cui ogni 7 ripetute div è inserito un div aggiuntivo. Questo div deve appartenere al genitore e non essere figlio di uno dei div ripetuti.

Non è sufficiente cambiare classe, l'intero contenuto sarà diverso e completamente diverso. La logica ngShow verrà utilizzata con il div aggiuntivo.

Così, per esempio:

<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> 

Questo esempio utilizza un numero specifico di div, il ngRepeat potrebbe essere qualsiasi numero. E 'anche importante l'ultimo risultato della ngRepeat mette in una div aggiuntivo dopo, anche se non è un multiplo esatto di 7.

L'attuale logica ngRepeat sto usando è:

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

Ma questo non funziona correttamente poiché il div aggiuntivo viene inserito solo una volta dopo tutte le div ripetute.

aggiornamento con l'esempio di lavoro

<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> 

Questa soluzione richiede AngularJS 1.2+

Answer 1

Hai bisogno di qualcosa vicino a questo:

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