角嵌套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的建议，并将数据预处理为易于渲染的结构。