Get attribut HTML par la portée de $ dans AngularJS

Question

D'accord, donc je fais une liste récursive en AngularJS utilisant ng-inclure et ng répétition, quelque chose comme ceci:

<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> 

Mais bien sûr, cela ne fonctionne pas. Donc, en gros ce que je dois est que chaque < li> élément dom a id qui correspond à ceci:

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

de sorte que chaque nouvelle < li> a id qui est égal à « id de son parent » + « - indice de $ ". Ce que je sais qui fonctionnera est que scope.layer [] et ses descendants de couche contiennent un champ qui sauvera l'ID du < li> et l'affichera, mais je veux éviter d'enregistrer ce champ supplémentaire dans la DB parce que la solution à cette est vraiment simple (comme montré dans l'exemple), mais je ne peux pas surmonter la syntaxe. Aucune suggestion?

Answer 1

Avant de passer à des données $scope.label vous pouvez boucle au-dessus avec la fonction qui boucle récursive branches et ajoute une propriété 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) 

DEMO http://jsfiddle.net/z4RPz/

Answer 2

Ce que je pense que vous êtes désireux de faire est de parvenir jusqu'à et prenez le $index de l'élément parent.

Vous pouvez le faire en utilisant $parent.$index - ou dans ce cas, il peut être $parent.$parent.$index, que vous utilisez ng-repeat -> ng-include -> ng-repeat

Voir cette réponse pour plus d'informations sur une situation similaire: https://stackoverflow.com/a/15257501/317180