AngularJS单行表上的多次重复重复

时间:2015-09-14 17:39:12

标签: angularjs ng-repeat

我正在尝试显示包含父对象和子对象列表中的项的表。是否可以使用ng-repeat执行此操作? for循环看起来像这样。

foreach(var parent in list)
  foreach (var child in parent)
     print(parent.1)
     print(parent.2)
     print(child.1)
     print(child.2)

以下是每行的外观的一般概念。

<table>
<tr ng-repeat="parent in list">
   ng-repeat="child in parent"
    <td>parent.item1</td>
    <td>parent.item2</td>
    <td>parent.item3</td>
    <td>child.item1</td>
    <td>child.item2</td>
</tr>
</table>

1 个答案:

答案 0 :(得分:9)

是的,很有可能。

假设一个名为parent的{​​{1}}对象数组parents本身就是parent.child个对象的数组,就像你的例子中那样,那么你会使用ngRepeat的特殊ng-repeat-start和ng-repeat-end形式执行以下操作。

child

<强>更新

由于OP似乎想要按父组分组的单独子行,这可能是寻求的解决方案:

<table>
<tr ng-repeat="parent in parents">  
    <td>parent.item1</td>
    <td>parent.item2</td>
    <td>parent.item3</td>
    <td ng-repeat-start="child in parent.child">child.item1</td> <!-- start of the inner loop -->
    <td ng-repeat-end>child.item2</td> <!-- end of inner loop -->
</tr>
</table>