Javascript 如何在不破坏浏览器的情况下显示长度未知的嵌套数组？

我有一个像这样组织的巨大数组：

[{ 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>

而且它还在继续

我试着用这样的方法：

[{ 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>

{node.name}
{{node.name}

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

---

有人知道我该怎么处理吗？或者，即使我有更好的方法来执行此树视图？

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

但有一个解决办法：

---

实际上，您需要的是在呈现父对象时临时删除嵌套元素。

听起来像是堆栈溢出情况。角度模板看起来不错，问题可能在于对象图中有一个循环（即，

节点

数组的成员已存在于树的其他位置）。这不是有效的HTML 5，循环数组中的所有节点，然后在每个步骤中包含循环数组中所有节点的代码，在此处包含循环数组中所有节点的代码，依此类推。在模板中使用

将停止无限循环。但它仍然是无效的HTML。此外，使用模板处理也不是问题。您没有机制说在包含的模板中使用新的node2作为变量节点。对不起，伙计们。我才意识到这是个打字错误。在我的代码中，它实际上是

。我已经编辑过了，非常感谢！您建议的这个解决方案在内存使用方面没有达到预期效果，但到目前为止，同一页面中的另一个解决方案帮助很大，没有任何内存泄漏。它实际上是迄今为止我见过的最简单的解决方案，它在链接函数中完成所有条件工作，而不是在html中。