Question

我想创建一个可以对评论发表评论的评论系统。为此，我需要编写以下HTML

<div ng-show="article.fetchedComments" ng-init="article.fetchedComments=[]" class="commentsContainer">
  <div ng-repeat="comment in article.fetchedComments" ng-show="article.fetchedComments" id="{{comment._id}}" class="eachcomment">
    <div class="col-md-2"><img ng-src="img/profilePicture/{{comment.user.id}}.jpg" width="50" class="profilepicture"/></div>
    <div class="col-md-10"><span ng-show="comment.user.id === userid" ng-click="deleteComment(comment._id)" class="glyphicon glyphicon-remove right"></span>
      <h5 class="commentusername"><a href="/user/{{comment.user.id}}">{{comment.user.name}}</a></h5>
      <p>{{comment.content}}</p><span ng-show="comment.user.id === userid" class="editreply"></span>
    </div>
  </div>
</div>

我需要实现回复部分。在单击回复按钮时，它应该获取该注释的注释并列出它们。对于1级，我可以使用相同的HTML并在单击Reply后粘贴它。但对于树状结构，我该怎么办？如果你不明白我需要做什么，我想实现像Quora这样的评论系统。

Answer 1

创建一个包含树结构和注释的obj。然后，您可以将此对象展平为recursivley到注释节点对象数组，并将移位（右）保存在每个节点的属性中。

使用此功能，您可以使用Include列出所有评论。只需根据计算的（移位）属性将它们移动到右侧。

如果要添加新注释，则需要在树结构中搜索父节点recursivley（重要：保存id以重新绑定此节点！）并向子注释添加新注释对象数组。

使用Angular的递归HTML元素

1 个答案: