Ich habe also eine ng-Wiederholung in einer anderen ng-Wiederholung verschachtelt, um ein Navigationsmenü zu erstellen. Auf jeder <li>
in der inneren ng-repeat-Schleife setze ich einen ng-Klick, der den entsprechenden Controller für diesen Menüpunkt aufruft, indem ich den $ -Index übergebe, um der App mitzuteilen, welchen wir benötigen. Ich muss jedoch auch den $ -Index aus der äußeren ng-Wiederholung übergeben, damit die App weiß, in welchem Abschnitt wir uns befinden und in welchem Tutorial.
<ul ng-repeat="section in sections">
<li class="section_title {{section.active}}" >
{{section.name}}
</li>
<ul>
<li class="tutorial_title {{tutorial.active}}" ng-click="loadFromMenu($index)" ng-repeat="tutorial in section.tutorials">
{{tutorial.name}}
</li>
</ul>
</ul>
Hier ist ein Plunker http://plnkr.co/edit/bJUhI9oGEQIql9tahIJN?p=preview
ng-click="loadFromMenu(section)"
. Wenn Sie $ index übergeben, führen Sie eine Schleife durch, um das nicht benötigte Objekt zu finden.Antworten:
Jede ng-Wiederholung erstellt einen untergeordneten Bereich mit den übergebenen Daten und fügt diesem Bereich eine zusätzliche
$index
Variable hinzu .Was Sie also tun müssen, ist, den übergeordneten Bereich zu erreichen und diesen zu verwenden
$index
.Siehe http://plnkr.co/edit/FvVhirpoOF8TYnIVygE6?p=preview
quelle
ng-click="loadFromMenu($parent.$index, $index)"
loadFromMenu($parent.$parent.$index,$index)
und in einigen, die Sie gerade brauchenloadFromMenu($parent.$index,$index)
,this....
würde die Verwendung einfach nicht funktionieren.Viel elegantere Lösung als
$parent.$index
verwendetng-init
:Plunker: http://plnkr.co/edit/knwGEnOsAWLhLieKVItS?p=info
quelle
ng-init
wurde inng-init
Dokumenten demonstriert, ohne dass dies in Dokumenten erwähnt wurde.ng-repeat
Deshalb habe ich hier geschrieben und die Dokumente auf Github geändert. Die aktuelleng-repeat
Syntax bietet einen besseren Weg, um dies zu erreichen, was @Okazari demonstriert. Es ist frei von einigen Mängeln, die Sie in den Kommentaren erwähnt haben.Was ist mit dieser Syntax (werfen Sie einen Blick in diesen Plunker ). Ich habe das gerade entdeckt und es ist ziemlich großartig.
Beispiel:
Mit dieser Syntax können Sie
$index
den beiden Indizes Ihren eigenen Namen geben und sie unterscheiden.quelle
Nur um jemandem zu helfen, der hierher kommt ... Sie sollten nicht $ parent. $ Index verwenden, da dies nicht wirklich sicher ist. Wenn Sie ein ng-if in die Schleife einfügen, wird der $ index durcheinander gebracht!
Richtiger Weg
Überprüfen Sie: plnkr.co/52oIhLfeXXI9ZAynTuAJ
quelle
Wenn Sie mit Objekten arbeiten, möchten Sie einfache IDs so weit wie möglich ignorieren.
Wenn Sie die Klicklinie in diese ändern, sind Sie auf einem guten Weg:
Ich denke auch, dass Sie sich möglicherweise ändern müssen
zu so etwas wie
Siehe http://docs.angularjs.org/misc/faq und suchen Sie nach ng-class.
quelle
Benutz einfach
ng-repeat="(sectionIndex, section) in sections"
und das wird auf der nächsten Ebene verwendbar sein ng-repeat down.
quelle