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

一尘不染

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

angularjs

我想知道是否存在针对此类问题的简单解决方案。

我有一个对象注释，该对象注释又可以包含注释，并且这些注释也可以包含注释…并且此操作可以进行未知数量的循环。

这是数据结构的示例：

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>

我该如何使div的嵌套注释达到“ n”级？

阅读 221

2020-07-04

共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](http://plnkr.co/edit/SqIzbR6Rgi5qbnAocFf5?p=preview)**

2020-07-04