2015-10-19 63 views
0

我想創建一個可以評論註釋的評論系統。爲此,我需要編寫以下HTML使用Angular的遞歸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。

回答

0

創建一個包含您的樹結構和您的評論的obj。然後,您可以將此對象向下展平爲一個註釋節點對象數組,並將每個節點的屬性內的移位(右側)保存在內。

有了這個你可以用ng-repeat來列出所有的評論。根據計算出的(移位)屬性,將它們移到右側。

如果你想添加你需要在你的樹結構中搜索父節點recursivley新評論(重要:保存一個id refind這個節點!),並添加一個新評論對象的兒童的意見陣列。