Angular.js: $ parent. $ index perdido al usar ng-if

Creado en 10 sept. 2015 · 3Comentarios · Fuente: angular/angular.js

Mi código HTML

 <div>
 <ul>
 <li ng-repeat = 'parentItem in arr1'>
 <div ng-repeat = 'childItem in arr2'>
 {{$ parent. $ index}}, {{$ index}}
 </div>
 </li>
 </ul>
 </div>

Código Javascript dentro del controlador

 $ scope.arr1 = [1,2];
 $ scope.arr2 = [1,2];

Este código me da la respuesta correcta.

 0, 0
 0, 1
 1, 0,
 1, 1

Pero si uso ng-if="true" en el ciclo secundario, me da una respuesta incorrecta

 <div>
 <ul>
 <li ng-repeat = 'parentItem in arr1'>
 <div ng-repeat = 'childItem in arr2' ng-if = "true">
 {{$ parent. $ index}}, {{$ index}}
 </div>
 </li>
 </ul>
 </div>

Esto estaba mal. Cambia el índice principal al índice secundario

Solucione este problema

Fuente

kishanmundha

Comentario más útil

Esto no es un problema en Angular. Esto sucede ( como se documenta ), porque ngIf crea un nuevo alcance, por lo que $parent no se refiere al alcance del ngRepeat externo.

Es por eso que usar $parent no es una buena práctica aquí. Podría / debería usar ngInit para crear un alias del índice principal, como este:

<li ng-repeat="parentItem in arr1" ng-init="parentIdx = $index">
  <div ng-repeat="childItem in arr2" ng-if="true">
    {{ parentIdx }} , {{ $index }}
  </div>
</li>

Manifestación

gkalpak en 10 sept. 2015

👍4

Todos 3 comentarios

Esto no es un problema en Angular. Esto sucede ( como se documenta ), porque ngIf crea un nuevo alcance, por lo que $parent no se refiere al alcance del ngRepeat externo.

Es por eso que usar $parent no es una buena práctica aquí. Podría / debería usar ngInit para crear un alias del índice principal, como este:

<li ng-repeat="parentItem in arr1" ng-init="parentIdx = $index">
  <div ng-repeat="childItem in arr2" ng-if="true">
    {{ parentIdx }} , {{ $index }}
  </div>
</li>

Manifestación

gkalpak en 10 sept. 2015

👍4

Por cierto, esta es una pregunta de apoyo general. Es mejor dirigir estas preguntas a los canales adecuados .
Los problemas de GitHub están reservados para informes de errores y solicitudes de funciones.

gkalpak en 10 sept. 2015

Gracias,

Puedo usar esto por ng-init

kishanmundha en 10 sept. 2015

¿Fue útil esta página

0 / 5 - 0 calificaciones