Question

我有一个JSON数组，其中包含没有按层次结构组织的对象，但是具有一对多的关系，类似于下面的示例：

[
        {"id": 1, "parentId": 5},
        {"id": 2, "parentId": 1},
        {"id": 3, "parentId": 1},
        {"id": 4, "parentId": 3},
        {"id": 5, "parentId": 3},
        {"id": 6, "parentId": 2},
        {"id": 7, "parentId": 4},
        {"id": 8, "parentId": 2}
]

我希望使用AngularJS以一种显示对象层次结构的方式在html表格中显示此数据，从所选对象开始。如果我们想要显示具有"id": 1的对象的层次结构，那么它应该生成类似于此的视图（直到底部）：

{"id": 1}
{"id": 2}             {"id": 3}
{"id": 6} {"id": 8}   {"id": 4} {"id": 5}
                      {"id": 7}

我已经构建了一个Angular服务来为我提供所选ID的所有子对象，但我不知道如何通过此数组循环（递归？）以产生所需的效果。

我认为可以使用递归模板完成，但我发现的所有示例都是基于已经分层结构化的data / json。我还试图嵌套ng-repeat指令但是我必须尽可能多地嵌套ng-repeat个{"id": 1, "parentId": 5}个指令。我还想过将整个数组转换为内置关系的另一个数组，但这看起来并不高效。

在vanilla javascript中，我会创建一个递归搜索对象的每个子节点的函数，如果找到，只需将它附加到DOM即可。

什么是＆＃34;棱角分明的方式＆＃34;实现这个目标？我真的不知道下一步该去哪里。

编辑：我应该明确说明元素的ID是循环的，因此应该有条件设置为在再次找到所选ID时停止。在上面的示例中，即使request.body

，也是ID为5的元素下的空字段

如何以分层方式循环并显示JSON中的数据？

0 个答案: