ng-repeat all'interno di ng-repeat con td per ogni elemento - AngularJS

Question

Questo codice mi fornisce una tabella con gli elementi in una singola colonna.

Qui i dati saranno come questo

var data = [[{"id":"1","value":"One"},{"id":"2","value":"Two"},{"id":"3","value":"three"}],[{"id":"4","value":"four"},{"id":"5","value":"five"},{"id":"6","value":"six"}],[{"id":"7","value":"seven"},{"id":"8","value":"eigth"},{"id":"9","value":"nine"}]] 

<div id="mydiv"> 
    <table> 
     <tr ng-repeat="rows in data"> 
      <td ng-repeat="item in rows">{{item.id}}:{{item.value}}</td> 
     </tr> 
    </table> 
</div> 

questo mi dà una tabella con tre colonne. Come

1:One 2:Two 3:three 
4:four 5:five 6:six 
7:seven . . . 

Insieme a questo voglio che il tavolo con item.id in una colonna : in una colonna e item.value in una colonna per una migliore leggibilità e non in una singola colonna.

Ho provato a farlo ma non sono in grado di farlo funzionare, qualcuno può aiutarmi con questo?

Answer 1

Si dovrebbe definire il vostro tavolo in questo modo:

<div id="mydiv"> 
    <table> 
     <tr ng-repeat="rows in data"> 
      <td ng-repeat-start="item in rows">{{item.id}}</td> 
      <td>:</td> 
      <td ng-repeat-end>{{item.value}}</td> 
     </tr> 
    </table> 
</div> 

Per ulteriori informazioni vedere il Special repeat start and end points section of the ngRepeat documentation:

Per ripetere una serie di elementi invece di uno solo elemento padre, ngRepeat (così come altre direttive ng) supporta l'estensione del range del ripetitore definendo i punti iniziali e finali espliciti usando rispettivamente ng-repeat-start e ng-repeat-end. La direttiva ng-repeat-start funziona allo stesso modo di ng-repeat, ma ripeterà tutto il codice HTML (incluso il tag su cui è definito) fino a includere il tag HTML finale dove viene posizionato ng-repeat-end.