Если вы начали применять вложенные циклы ng_repeat, но не сильно вникали как это работает, то могли столкнуться с проблемой видимости итератора внешнего цикла во внутреннем.
В контексте цикла Angular создает несколько переменных, одна из них — $index, которая является итератором элементов цикла, т.е. меняется от 0 до length-1.
Вложенный цикл в своей области видимости также создает набор переменных с теми же именами, тем самым перекрывая родительский $index.
Как получить доступ к родительскому индексу в контексте вложенного цикла?
Способ №1
Используем ng_init, чтобы скопировать $index в другую переменную.
|
1 2 3 4 5 |
<div ng_repeat="elmParent as arrayParent" ng_init="parentIndex = $index"> <div ng_repeat="elmNested as arrayNested"> Родительский индекс = {{parentIndex}}, вложенный индекс = {{$index}} </div> </div> |
Способ №2
Обращаемся к контексту родителя, через parent.
|
1 2 3 4 5 |
<div ng_repeat="elmParent as arrayParent"> <div ng_repeat="elmNested as arrayNested"> Родительский индекс = {{parent.index}}, вложенный индекс = {{$index}} </div> </div> |
Первый способ более удачный для чтения кода — всегда понятно о каком индексе идет речь. Зато второй — короче и не создаёт лишних переменных.
