AngularJS在单行表上多次重复 - 扩展

Question

这是AngularJS Multiple ng-repeats on single row of table的扩展问题

我正在尝试展示一个 grandChilds 收藏。 for 循环看起来像这样。

foreach(var parent in list)
  foreach (var child in parent)
    foreach (var grandChild in child)
     print(grandChild.item1)
     print(grandChild.item2)
     print(grandChild.item3)

以下是每一行的大致情况。

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

在上面提到的问题中，TBODY 是个好主意。但它只会满足两个层次（即父母和孩子）。我怎样才能达到我的要求（父母，孩子，孙子）。请帮助我。

如果我使用嵌套的TBODY，那么它在W3C 验证中失败。

请帮助我如何实现这一目标

Answer 1

为每个父级使用新表。

<table ng-repeat="parent in list">
<tbody>
    <tr ng-repeat="child in parent">
        <td ng-repeat="grandchild in child"></td>
    </tr>
</tbody></table>

Answer 2

您可以在列表的表格中为孙子集合显示一个表格（或其他元素，例如 span\div）

<table>
<tr ng-repeat="parent in list">
    <td ng-repeat="child in parent">
        <table>
            <tr ng-repeat="grandChild in child">
              <td ng-repeat="item in grandChild">
                {{item}}
              <td>
             </tr>
        </table>
    </td>
</tr></table>

编辑：我已将其替换为 div 元素。您可以研究如何对显示中的数据进行排序。

<table>
<tr ng-repeat="parent in list">
    <td ng-repeat="child in parent">
        <div ng-repeat="grandChild in child">
            <div ng-repeat="item in grandChild">
                {{item}}
            </div>
        </div>          
    </td>
</tr></table>