AngularJS:如何计算&迭代数据时的打印深度

时间:2016-05-18 13:01:52

标签: angularjs

我的json完全如下:

[{"ID":1,"Name":"Suzy","ParentID":0},
{"ID":2,"Name":"Somi","ParentID":1},
{"ID":3,"Name":"Romi","ParentID":2},
{"ID":4,"Name":"Jumi","ParentID":3},
{"ID":5,"Name":"Gargi","ParentID":0},
{"ID":6,"Name":"Sujoy","ParentID":5},
{"ID":7,"Name":"Kamal","ParentID":6},
{"ID":8,"Name":"Joy","ParentID":0},
{"ID":9,"Name":"Sumana","ParentID":8},
{"ID":10,"Name":"Alex","ParentID":0}]

在我的情况下,关系与ID和ParentID建立。该关系可以嵌套到第n级。使用ng-repeat显示亲子关系时如何打印深度。

这样我试过

<div ng-app="myApp">
    <ul class="nav nav-pills" data-ng-controller= "MasterDetails" >
        <li
            data-ng-repeat="parent in details | filter: { ParentID: 0 }" >
            <a href="#/customers"> {{ parent.Name }} </a>
            <ul>
                <li data-ng-repeat="child in details | filter: { ParentID: parent.ID }">
                    {{ child.Name }}
                </li>
            </ul>
        </li>
    </ul>
</div>

angular.module("myApp", []).
controller("MasterDetails", ['$scope', function($scope) {
    $scope.details = [{"ID":1,"Name":"Suzy","ParentID":0},
{"ID":2,"Name":"Somi","ParentID":1},
{"ID":3,"Name":"Romi","ParentID":2},
{"ID":4,"Name":"Jumi","ParentID":3},
{"ID":5,"Name":"Gargi","ParentID":0},
{"ID":6,"Name":"Sujoy","ParentID":5},
{"ID":7,"Name":"Kamal","ParentID":6},
{"ID":8,"Name":"Joy","ParentID":0},
{"ID":9,"Name":"Sumana","ParentID":8},
{"ID":10,"Name":"Alex","ParentID":0}];
}]);

这是jsfiddle https://jsfiddle.net/tridip/s0svpaev/2/

层次结构应该看起来像这样深度

Suzy 0
    Somi 1
        Romi 2
            Jumi 3
Gargi 0
    Sujoy 1
        Kamal 2
Joy 0
    Sumana 1
Alex 0   

只需查看我的代码并指导我如何计算&amp;迭代数据时的打印深度,如0,1,2 ......等等嵌套数据。在json中应该没有深度数据,而应该在运行中计算。我们可以在这里使用$index打印深度吗?寻找想法。感谢

0 个答案:

没有答案