Il modulo è possibile con ng-if/ng-repeat?

Question

Utilizzando una ripetizione angolare di ng, sto cercando di creare un carosello con 3 s in ogni <li>. Posso facilmente crearlo con 1 div per diapositiva ma non riesco a ottenere 3. Con js, userei normalmente un modulo (%) per capire se l'indice è divisibile per 3, e quindi apri/chiudi lo li Là.

E 'possibile farlo con Angular?

Questo è ciò che ho (1 articolo per vetrino):

<ul carousel class="carousel"> 
    <li class="slide" ng-repeat="item in item.list.items" ng-init="itemIndex = $index"> 
    <div class="item">{{item}}</div> 
    </li> 
</ul> 

questo è quello che sto cercando di realizzare (3 articoli per vetrino):

<ul class="carousel"> 

    <!-- slide 1, with 3 items --> 
    <li class="slide"> 
    <div class="item">Item 1</div> 
    <div class="item">Item 2</div> 
    <div class="item">Item 3</div> 
    </li> 

    <!-- slide 2, with 3 items --> 
    <li class="slide"> 
    <div class="item">Item 4</div> 
    <div class="item">Item 5</div> 
    <div class="item">Item 6</div> 
    </li> 

    <!-- and so on... --> 
</ul> 

Modifica

Questa domanda è stata identificata come duplicata da isherwood. La domanda molto chiaramente chiede di usare il modulo all'interno di ng-if, non di controller. Il duplicato suggerito è vicino, ma Betty St risponde alla domanda esatta di seguito, con un esempio di codice e un collegamento. Grazie Betty!

Answer 1

È possibile utilizzare % o groupBy. Io uso sempre il modulo come descritto qui: https://stackoverflow.com/a/25838091/595152

La soluzione dovrebbe essere simile a questo:

<ul carousel class="carousel"> 
    <li class="slide" ng-repeat="_ in item.list.items" ng-if="$index % 3 == 0"> 
    <div class="item" ng-repeat="i in [$index, $index + 1, $index + 2]" ng-init="item = item.list.items[i]"> 
     <div ng-if="item">{{item}}</div> 
    </div> 
    </li> 
</ul> 

è necessario aggiungere un div con ng-if all'interno del div.item per assicurarsi che esista la voce;)

Answer 2

Dai un'occhiata al filtro groupBy per raggruppare gli articoli in 3 gruppi.

https://github.com/a8m/angular-filter#groupby