javascript - Angular JS 中的嵌套列表

Question

我正在尝试创建 JSON 以用于嵌套列表。

我假设我在第二个 ng-repeat 上使用了不正确的语法:

<ul>
    <li ng-repeat="n in navData">Label = {{n.label}}</li>
      <ul>
        <li ng-repeat="n.children in n">Child label = {{p.label}}</li>
      </ul>
  </ul>

当我的数据模型是

var nav = [{
        label: 'Pages',
        value: 'pages',
        children: [{
            label: 'Home',
            value: 'home'
        }, {
            label: 'Left Nav',
            value: 'left-nav'
        }]
    }, {
        label: 'Components',
        value: 'components'
    }];

我在 html 中得到的只是顶层:

• 标签 = 页面
• 标签=组件

Answer 1

外部 li 标签应在带有 ng-repeat 的内部 li 标签之后关闭。并且您应该使用不同的 var 名称和稍微不同的表达式(实际上您已将 var 命名为 p {{p.label}} 某处但不在嵌套循环中):

<ul>
    <li ng-repeat="n in navData">Label = {{n.label}}<!-- closing li removed //-->
      <ul>
        <li ng-repeat="p in n.children">Child label = {{p.label}}</li>
      </ul>
    </li> <!-- closing li tag added //-->
</ul>