Javascript AngularJS[infinite digest cycle]中无限嵌套注释的呈现视图

我目前正在尝试无限嵌套注释（及其回复），类似于Reddit

我目前有一个大结构的一般形式：

[
    {
        comment_id: 1
        comment_text: "root1"
        replies:[
            {
                 comment_id: 2
                 comment_text: "reply1",
                 replies: [
                      ....
                 ]
            }   
        ]
    },
    {
        comment_id: 3
        comment_text: "root2"
        replies:[
              ...
        ]
    },
]

因为所有的评论都遵循一个通用的

div模板

，它们的回复都是

左边距：50px另外，我遵循本教程，使用递归
ng repeat
，递归地包含模板及其回复


我的代码在HTML中是这样的：

<script type="text/ng-template" id="commentTree">
    <div>
        <img ng-src="{{comment.author.avatar}}" style="height:50px;">
        <a ng-href="/user/{{comment.author.user_id}}">{{comment.author.username}}</a>
        <br/>
        <small><strong>Posted</strong> <span am-time-ago="comment.date_posted"></span></small>
        <p>
            {{comment.comment_text}}
        </p>
        <span style="margin-right:5px;">
            <a href ng-click="comment.show_reply_box = true;" ng-show="!comment.show_reply_box">
            Reply
            </a>
            <div ng-show="comment.show_reply_box">
                <textarea ng-model="comment.possible_reply" class="form-control" rows="3" placeholder="Write your reply here..."></textarea>
                <span style="margin-right:10px;"><button class="btn btn-default btn-sm" ng-click="vm.post_comment(comment, comment.possible_reply)">Comment</button></span>
                <button class="btn btn-default btn-sm" ng-click="comment.show_reply_box = false;">Cancel</button>
            </div>
        </span>
    </div>
    <hr>
    <div ng-repeat="comment in comment.replies" ng-include="'commentTree'" style="margin-left:50px;">
    </div>
</script>

    <div ng-repeat="comment in comment.replies" ng-include="'commentTree'" style="margin-left:50px;">
    </div>




已发布

{{comment.comment_text}

评论
取消


然而，问题是，
ng repeat
的优化非常糟糕，由于嵌套的
ng repeat
s，我得到了
infdig
错误周期。这很奇怪，因为我确信这不是因为我的评论太多，而是因为我嵌套了
ng repeats
。但是，它确实提供了非常有用的数据绑定。我想继续使用
ng repeat
或至少以某种形式维护双向数据绑定，但要避免这种
infdig
循环。有人知道什么是无限嵌套注释的最佳实践，或者如何为此优化AngularJS吗？
如果在模板中包装
ng repeat
，看起来您缺少了
ng

更改：

 <div ng-repeat="comment in comment.replies" ng-include="'commentTree'" style="margin-left:50px;">
</div>



致：



注意，如果没有答复，则假定答复的数组为空。如果没有回复且未添加空回复数组，则代码应为：

<div ng-if="comment.replies">
    <div ng-repeat="comment in comment.replies" ng-include="'commentTree'" style="margin-left:50px;">           
    </div>
</div>



示例：
Hi Philip，我下面给出的答案对你有帮助吗？最好的，露德
<div ng-if="comment.replies">
    <div ng-repeat="comment in comment.replies" ng-include="'commentTree'" style="margin-left:50px;">           
    </div>
</div>