ng-parent $parent가 네스트되었습니다.$index 및 $index

ng-parent $parent가 네스트되었습니다.$index 및 $index

불행히도 jsfiddle로는 복제할 수 없는 이상한 버그가 있습니다.이하의 스니펫을 제외한 모든 코드(라이브러리 등 제외)를 코멘트 아웃 했습니다.제가 모르는 게 있나요?좋은 생각 있어요?

동작 및 인쇄: (0,0) (0,1) (1,0)

<div ng-repeat="i in list">
    <div ng-repeat="j in list2">
        <div>
            ({{$parent.$index}} {{$index}})
        </div>
    </div>
</div>

단, 이 코드 조각은 (0,0) (1,1) (0,0) (1,1)를 인쇄합니다.

<div ng-repeat="i in list">
    <div ng-repeat="j in list2">
        <div ng-if="1">
            ({{$parent.$index}} {{$index}})
        </div>
    </div>
</div>

컨트롤러:

$scope.list  = [1, 2];
$scope.list2 = [1, 2];

데모 바이올린

그 이유는 지시가ng-if새로운 스코프가 생성됩니다.$parent즉시 액세스 할 수 있습니다.$parent의 범위, 즉 내부 반복식의 범위입니다.

따라서 이전과 같이 원하는 것을 달성하고 싶다면 다음을 사용할 수 있습니다.

<div ng-repeat="i in list">
    <div ng-repeat="j in list2">
        <div ng-if="1">
            ({{$parent.$parent.$index}} {{$parent.$index}})
        </div>
    </div>
</div>

만약 당신이 둘 이상의 내부 지시사항을 가지고 있다면, 당신은 사용할 수 있습니다.ng-init저장용$index하위 스코프의 참조를 위한 변수입니다.

<div ng-repeat="i in list" ng-init="outerIndex=$index">
    <div ng-repeat="j in list2" ng-init="innerIndex=$index">
        <div ng-if="1">
            ({{outerIndex}} {{innerIndex}})
        </div>
    </div>
</div>

각도의 스코프를 이해하는 것에 관한 이 기사를 읽어 보시기 바랍니다.

사용하는 대신ng-init를 사용할 수 있습니다.(key, value) ng-repeat구문에서 상위 인덱스를 가져옵니다.

데모

<div ng-repeat="(iKey, i) in list">
    <div ng-repeat="j in list2">
        <div ng-if="1">
            ({{iKey}} {{$index}})
        </div>
    </div>
</div>

PLUNK 체크

ng-if는 $parent를 추가해야 하기 때문에 새로운 자식 범위를 만들고 있습니다.나는 창조했다myname스코프명을 나타내는 속성. 이를 사용하여 정확히 무슨 일이 일어나고 있는지 확인할 수 있습니다.

<div ng-if="1">
    ({{$parent.$parent.$index}} {{$parent.$index}})
</div>

그ng-if다른 범위를 도입하기 때문에$parent.충분하지 않습니다.

이렇게 두 배로 할 수 있어요.$parent.$parent.$index또는 외부 인덱스를 기억하십시오.ng-repeat경유하여 다른 변수로ng-init다음과 같습니다.

<div ng-repeat="i in list" ng-init="listIndex = $index">
  <div ng-repeat="j in list2">
    <div ng-if="1">
      ({{listIndex}} {{$index}})
    </div>
  </div>
</div>

플런커의 예: http://plnkr.co/edit/dtaBAmkU32BCsLASLs0C?p=preview

언급URL : https://stackoverflow.com/questions/25094201/nested-ng-repeat-parent-index-and-index