如何使用ng-repeat显示所有嵌套的json数据？

Question

这是我的JSON数据:

"multipleLayerDropdown" : [
                                        {"title":"Google","url":"#"},
                                        {"title":"Another action","url":"#"},
                                        {"title":"Something else here","url":"#"},
                                        {"title":"More options", "submenu":[
                                                                             {"title":"Second Level 1","url":"#"},
                                                                             {"title":"Second Level 2","submenu":[ 
                                                                                                                   {"title":"Third Level 1","url":"#"},
                                                                                                                   {"title":"Third Level 2","url":"#"}
                                                                                                                   ]},
                                                                             {"title":"Second Level 3","url":"#"},
                                                                             {"title":"Second Level 4","submenu":[
                                                                                                                   {"title":"Third Level 1","url":"#"},
                                                                                                                   {"title":"Third Level 2","url":"#"}
                                                                                                                   ]}
                                                                             ]}

                         ]

我希望如下:

• 谷歌
• 另一个动作
• 还有别的什么
• 更多的选择
  • 二级1
  • 二级2
    • 第三级1
    • 第三级2
  • 第二级3
  • 二级4
    • 第三级1
    • 第三级2

上面的示例仅显示3个嵌套级别.如果嵌套数据大于3,则也会显示.例如,如果嵌套的JSON数据为5,则将显示其中的5个.任何人都知道如何显示所有嵌套的JSON数据(使用ng-repeat /任何其他angularjs方法)？

Answer 1

尝试使用ng-repeat指令的ng-template.所以我们可以创建树形结构视图.

Plunkr链接:http://plnkr.co/edit/UIGyPsbavIC7OpF6DFEQ？p = preview

<script type="text/ng-template" id="tree-structure">
     <ul class="childElement">
        <li ng-repeat="data in data.nodes" ng-include="'tree-structure'"></li>
     </ul>
</script>

<ul class="parentList">
    <li ng-repeat="data in data.nodes" ng-include="'tree-structure'"></li>
</ul>