角嵌套NG重複表

Question

鑑於TableController的數據結構：

var obj = { 
    titles : { 
    title: 'Title' 
    , data : ['a title' , 'another title', 'look a title', 'and another'] 
    } 
, other-prop : { 
    title: 'Other Prop' 
    , data : [3030, 849875, 8888, 48484] 
    } 
} 

this.obj = obj; 

，如果你的目標是創建一個像表：

table 
    thead 
    tr 
     th "Title" 
     th "Other Prop" 

    tbody 
    tr 
     td "a title" 
     td "3030" 
    tr 
     td "another title" 
     td "849875" 
    tr 
     td "look a title" 
     td "8888" 
    tr 
     td "and another" 
     td "48484" 

你將如何構建的NG-重複？現在，我有：

div [controller="TableController as table"] 

table 
    thead 
    tr 
     th [ng-repeat = "(key, value) in table.obj"] 

    tbody 
    tr [ng-repeat = "(key, value) in table.obj" 
     td [ng-repeat="(key, val) in table.obj track by $index"] "{{value.data}}" 

這是給我...

table 
    thead 
    tr 
     th "Title" 
     th "Other Prop" 
    tbody 
    tr 
     td "['a title' , 'another title', 'look a title', 'and another']" 
     td "[3030, 849875, 8888, 48484]" 
    tr 
     td "['a title' , 'another title', 'look a title', 'and another']" 
     td "[3030, 849875, 8888, 48484]" 

...所以我很接近，但我不能讓...對象在正確的方向列出。

有人嗎？

Answer 1

您可以通過直接索引到table['other-prop'].data數組做到這一點：

div [controller="TableController as table"] 

table 
    thead 
     tr 
      th [ng-repeat = "(key, value) in table.obj"] 

    tbody 
     tr [ng-repeat = "(key, value) in table.obj.data" 
      td "{{value}}" 
      td "{{table['other-prop'].data[$index]}}" 

它會工作，但它不是擴展到列表中的任意數。

爲此，您需要採取Brian Noah的建議，並將數據預處理爲易於渲染的結構。