ng-repeat ng-repeat ile her bir öğe için td ile - AngularJS

Question

Bu kod, tek bir sütundaki elemanları içeren bir tablo verir. Bu

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> 

Bu üç sütun ile bana bir tablo verir gibi

İşte

veri olacaktır. Bunun yanında

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

gibi ben tek sütunda bir sütun : ve daha iyi okunabilmesi için değil, tek bir sütunda item.value bir kolonda item.id ile masa istiyorum.

Bunu yapmaya çalıştım ancak çalışamıyorum, birisi bana bununla yardımcı olabilir mi?

Answer 1

Sen tablo bu şekilde tanımlamalıdır:

yerine sadece bir ebeveyn elemanı, ngRepeat (unsurlarının bir dizi tekrarlamak yanı sıra için: Daha fazla bilgi için

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

bkz Special repeat start and end points section of the ngRepeat documentation diğer yönerge direktifleri), sırasıyla ng-tekrar-başlatma ve ng-tekrar-sonu kullanarak açık başlangıç ​​ve bitiş noktalarını tanımlayarak tekrarlayıcı aralığını genişletmeyi destekler. Ng-repeat-start yönergesi ng-repeat ile aynı şekilde çalışır, ancak ng-repeat-end'in yerleştirildiği son HTML etiketine kadar ve dahil olmak üzere tüm HTML kodunu (üzerinde tanımlanmış olan etiket dahil) tekrar edecektir.