如何在不使浏览器崩溃的情况下显示未知长度的嵌套数组？

Question

我有一个巨大的数组，组织起来有点像这样：

[{ name: 'name1',
   nodes: []},
 { name: 'name2',
   nodes: [
    { name: 'name21',
      nodes: [
        { name: 'name211',
          nodes: []},
        { name: 'name212',
          nodes: []}]
    }]
 },
 { name: 'name3',
   nodes: [...] },
 {...}
]

然后继续...

我试过用这样的东西：

<script type='text/ng-template', id='categoryTree'>
   <p ng-if='!node.nodes'> {{node.name}} </p>
   <details ng-if='node.nodes'>
       <summary><b> {{node.name}}</b></summary>
       <ul>
           <span ng-repeat="node in node.nodes" ng-include="'categoryTree'"></span>
   </details>
</script>

<div>
   <ul>
       <span ng-repeat="node in objArray" ng-include="'categoryTree'"></span>
</div>

这给了我想要的以树格式显示所有嵌套数组的功能。问题是它似乎陷入了无限循环，因为当我查看任务管理器时，使用的 RAM 开始增加并且仅在 Chrome 崩溃时停止。

有谁知道我该如何解决这个问题？或者即使我有更好的方法来做这个树视图？

Answer 1

Angular 不真正处理递归指令 - 默认情况下

但有一个解决方案：

https://github.com/marklagendijk/angular-recursion

你真正需要的是在渲染父元素时临时移除嵌套元素。

如何在不使浏览器崩溃的情况下显示未知长度的嵌套数组？

How do I show an unknown length nested array without crashing the browser?

html

javascript

angularjs

angularjs-ng-repeat

pug