Angularjs 不允许你在 li 中递归创建 ul

Question

如何使用ng-repeat创建深层结构？我在此指令中自动关闭的标签遇到问题。

有人可以帮助我吗？

<ul>
    <li>A
        <ul>
            <li>B
                <ul>
                    <li>C
                       <ul><li>D</li></ul>
                    </li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

这是 JSON 代码。

{"obj":[{"code":"0","name":"A"},{"code":"1","name":"B"},
    {"code":"2","name":"C"},{"code":"3","name":"D"}]}

提前谢谢。

Answer 1

这是我的代码

<script type="text/ng-template" id="categoryTree">
            <!-- {{ncm | json}} = { "tipo": "SECAO", "codigo": "XV", "nome": "METAIS COMUNS E SUAS OBRAS", "notas": [ 87 ] } -->
            {{ncm.codigo}}
            <ul>
                <li ng-include="'categoryTree'"></li>
            </ul>
</script>
<ul>   
    <li ng-repeat="ncm in vm.nomenclaturaList.ancestrais" ng-include="'categoryTree'" ng-hide="$first"></li>
</ul>

Answer 2

这是验证的代码

https://jsfiddle.net/elciospy/ps3xby70/10/

<script type="text/ng-template"  id="tree_item_renderer.html">
    {{data.name}}
    <ul>
        <li ng-repeat="data in data" ng-include="'tree_item_renderer.html'"></li>
    </ul>
</script>
<ul ng-controller="TreeController">
    <li ng-repeat="data in tree.obj" ng-include="'tree_item_renderer.html'"></li>
</ul>

控制器

angular.module("myApp", []).
controller("TreeController", ['$scope', function($scope) {
    $scope.tree = {"obj":[{"code":"0","name":"A"},{"code":"1","name":"B"},
    {"code":"2","name":"C"},{"code":"3","name":"D"}]}
}]);