0

好的，所以我正在使用 ng-include 和 ng-repeat 在 AngularJS 中创建一个递归列表，如下所示：

<div id="wrapper">
<div id="text" ng-click="DivClick()">
    <ul>
        <li id="{{$index}}" ng-repeat="data in layer" ng-include="'recursion.html'"></li>
    </ul>
</div>


<script type="text/ng-template"  id="recursion.html">
<textarea myd-keypress cols="63" rows="1">{{data.content}}</textarea>
<input type="text" myd-numbers value="{{data.price}}"></input>
<ul>
    <li ng-repeat="data in data.layer" ng-include="'recursion.html'" id="{{$parent.$attr('id') + '-' + $index}}"></li>
</ul>

但是，当然，它不起作用。所以基本上我需要的是 dom 中的每个 <li> 元素都有对应的 id，如下所示：

 0
 1
   1-0
   1-1
     1-1-0
   1-2
   1-3
 2
   2-0

这样每个新的 <li> 的 id 都等于“其父级的 id”+“-$index”。我知道这将起作用的是 scope.layer[] 及其图层后代包含一个字段，该字段将保存 < li> 的 ID 并显示它，但我想避免在数据库中保存该额外字段，因为解决方案是非常简单（如示例所示），但我无法克服语法。有什么建议么？

4

2 回答 2

0

在将数据传递给$scope.label您之前，您可以使用递归循环分支并添加id属性的函数对其进行循环

var data = [{
    name: 'foo',
    children: [{
        name: 'foo child',
        children: [{
            name: 'foo child grandchild'
        }, {
            name: 'foo child grandchild2'
        }]
    }, {
        name: 'foo child2'
    }]
}, {
    name: 'bar'
}]

function createID(arr, parentID) {
   for (var i = 0; i < arr.length; i++) {
        var id = (i + 1).toString();
        var thisID = parentID ? parentID + '-' + id : id;
        arr[i].id = thisID;
        if (arr[i].children) {
             createID(arr[i].children, thisID)
         }
    }
 }
createID(data, null)

演示http://jsfiddle.net/z4RPz/

于 2013-04-09T18:13:13.990 回答
0

我认为您想要做的是伸手$index从父元素中获取。

您可以使用$parent.$index- 或者在这种情况下，它可能是$parent.$parent.$index，因为您正在使用ng-repeat -> ng-include -> ng-repeat

有关类似情况的更多信息，请参阅此答案： https ://stackoverflow.com/a/15257501/317180

于 2013-04-09T22:37:14.413 回答