javascript - 无限、永无止境、嵌套 ng-repeat

Question

我有以下 json 对象:

"comments": [
    {"username": "test", "comment": "This is a comment",
    "child": [
        {"username": "chriscool", "comment": "I replied to the above comment",
        "child": [
            {"username": "Anotherperson", "comment": "But what if I replied again",
            "child": [
                {"username": "ralphy", "comment": "And again?!" }
            ] }
        ] },
        {"username": "ralphy", "comment": "I also replied" }
    ] }
]

如您所见，每个评论都可以有一个子评论，因此它实际上可以永远持续下去。我试图显示所有这些，但我不知道如何做到这一点。

这就是我到目前为止所拥有的全部内容(显然这只能获得每个评论中的第一个 child ):

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

Answer 1

您可以创建自己的指令，可以根据您的情况递归调用该指令

标记

<div my-recursive-dir="comments"><div>

指令

app.directive('myRecursiveDir', function(){
  return {
     templateUrl: 'Recursive.html',
     scope: {
        comments: '=',
     },
     replace: true
  };
});

递归.html

<div ng-repeat="c in comments.child">
    {{c.comment}}
    <div ng-if="c.child" my-recursive-dir="c"><div>
</div>