AngularJS ng-repeat一个未知的深度数组

时间:2016-06-26 10:47:48

标签: javascript angularjs json

我需要有可能将可能的无限深层阵列结构打印到列表中。这是来自修改后的AngularJS示例的代码,其中我在数组中添加了一些更深的子代。如何打印child of child甚至是其子女?只要有更多的孩子,我有没有办法让它永远重复?

HTML

<div ng-app>
  <div ng-controller="TodoCtrl">
    <ul>
      <li ng-repeat="todo in todos">
        <span>{{todo.text}}</span>
        <ul>
          <li ng-repeat="child in todo.children">
            <span>{{child.text}}</span>
            <!-- What about the next one -->
          </li>
        </ul>
      </li>
    </ul>
  </div>
</div>

JS

function TodoCtrl($scope) {
  $scope.todos = [{
    text: 'root 1',
    children: [{
      text: 'child of root 1',
      children: [{
        text: 'child of child',
        children: []
      }]
    }]
  }, {
    text: 'root 2',
    children: []
  }];
}

小提琴:https://jsfiddle.net/U3pVM/25866/

1 个答案:

答案 0 :(得分:1)

您可以通过这种方式递归使用视图:

routesGenerator := InjectedRoutesGenerator

此处DEMO基于您的示例数据。