javascript - AngularJS 多个嵌套 ng-repeats

Question

当我有 json 时，我经常做一个嵌套的 ng-repeat 来循环子数据，例如

[
 { "accountnum": 1,
   "name": "foo",
   "subacct": [
      { "accountnum": 1-1,
        "name": "bar"
      } ...
    ]
  } ...
]

然后我使用这个模式:

     <tr ng-repeat-start="a in cac.costAccounts">
          <td>{{a.first_name}} {{a.last_name}}</td>
          <td>{{a.account_number}}</td>
          <td>{{a.description}}</td>
        </tr>
        <tr ng-repeat-end ng-repeat-start="sa in a.subacct">
          <td>{{sa.first_name}} {{sa.last_name}}</td>
          <td>{{sa.account_number}}</td>
          <td>{{sa.description}}</td>
        </tr>

这有效。但是这次数据包含第三个级别； subacct 对象的键为 subsubacct。

[
 { "accountnum": 1,
   "name": "foo",
   "subacct": [
      { "accountnum": 1-1,
        "name": "bar",
        "subsubacct": [
        { "accountnum": 1-1-1,
          "name": "bar"
        } ...
      } ...
    ]
  } ...
]

所以我尝试添加第三个级别，但它没有显示(没有控制台错误):

        <tr ng-repeat-start="a in cac.costAccounts">
          <td>{{a.first_name}} {{a.last_name}}</td>
          <td>{{a.account_number}}</td>
          <td>{{a.description}}</td>
        </tr>
        <tr ng-repeat-end ng-repeat-start="sa in a.subacct">
          <td>{{sa.first_name}} {{sa.last_name}}</td>
          <td>{{sa.account_number}}</td>
          <td>{{sa.description}}</td>
        </tr>
        <tr ng-repeat-end ng-repeat="ssa in sa.subsubacct">
          <td>{{ssa.first_name}} {{ssa.last_name}}</td>
          <td>{{ssa.account_number}}</td>
          <td>{{ssa.description}}</td>
        </tr>

那么如何获得第三个循环？

Answer 1

一种解决方案是使用 tbody

<tbody ng-repeat="a in cac.costAccounts">
    <tr>
      <td>{{a.first_name}} {{a.last_name}}</td>
      <td>{{a.account_number}}</td>
      <td>{{a.description}}</td>
    </tr>
    <tr ng-repeat-start="sa in a.subacct">
      <td>{{sa.first_name}} {{sa.last_name}}</td>
      <td>{{sa.account_number}}</td>
      <td>{{sa.description}}</td>
    </tr>
    <tr ng-repeat-end="ssa in sa.subsubacct">
      <td>{{ssa.first_name}} {{ssa.last_name}}</td>
      <td>{{ssa.account_number}}</td>
      <td>{{ssa.description}}</td>
    </tr>
</tbody>