javascript - ng-repeat 未知数量的嵌套元素

Question

我想知道这种类型的问题是否有一个简单的解决方案。

我有一个对象评论，它又可以包含评论，这些评论也可以包含评论……这可以持续未知数量的周期。

下面是一个数据结构的例子：

var comment = {
   text : "",
   comments: [
      { text: "", comments : []},
      { text: "", comments: [
         { text: "", comments : []},
         { text: "", comments : []}
         { text: "", comments : []}
      ]}
   ]
}

假设我会写 2 个级别的评论：

<div ng-repeat="comment in comments">
   {{comment.text}}
   <div ng-repeat="comment in comments">
      {{comment.text}}
   </div>
</div>

我将如何为“n”级嵌套评论实现我的 div？

Answer 1

最简单的方法是创建一个通用的部分，这样您就可以使用递归调用和渲染它ng-include。

<div ng-include="'partialComment.html'" ng-model="comments"></div>

以下是部分内容：

<ul>
    <li ng-repeat="c in comments">
      {{c.text}}
      <div ng-switch on="c.comments.length > 0">
        <div ng-switch-when="true">
          <div ng-init="comments = c.comments;" ng-include="'partialComment.html'"></div>  
        </div>
      </div>
    </li>
</ul>

数据模型应该是一个列表var comments = [{ ... }]。

我为您创建了一个演示，希望对您有所帮助。

Demo

Answer 2

你需要一个递归指令。像这样的东西，或者可能更好。