Angular JS repeater에서 변수를 반복 하시겠습니까?

Question

div가 숨겨져 있고 다음 div가 표시되는 설치 프로그램이있어 축소 된 div를 만듭니다. 공시에 대한 내부 헤더 스타일을 (나는 겨 쇼하는 div에 변수를 사용하고, 그리고 숨기기/표시를하지 사업부는 사업부를 클릭

<div ng-click="costSummary=!costSummary" ng-class="{open : costSummary}">

변수와 클래스를 토글입니다 삼각형). 잘 작동합니다.

그러나 ng-repeat에서이 구문을 사용해야하며 각 반복에 고유 한 클래스가 있도록 해당 변수를 어떻게 증가시킬 수 있는지 잘 모르겠습니다. 마찬가지로이 표시/숨기기 이후

<div ng-click="myVar1=!myVar1" ng-class="{open : myVar1}" ng-repeat="claim in claims">

각 헤더/DIV 쌍을 필요로하는 고유 한 클래스 이름을 가지고있다.

이 경우 색인 번호 등을 어떻게 추가 할 수 있습니까?

Answer 1

ng-repeat에 여러 변수를 추가 할 필요가 없습니다. ng-repeat은 각각의 반복마다 하위 범위를 만들기 때문입니다. 그래서 변수는 자식 범위에로 작성하므로 너무 ng-repeat

의 다른 자식 범위 볼 하나 개의 변수되지는

<div ng-click="myVar1=!myVar1" ng-class="{open : myVar1}" ng-repeat="claim in claims"> 
{{ claim }} 
</div> 

이 충분하다. 여기

이 (가) Plunker

Answer 2

ng-repeat에는 $index에 대한 액세스 권한이 있습니다. 이는 반복되는 컬렉션에있는 현재 항목의 색인을 제공합니다. 이 클래스를 사용하여 고유 한 클래스 ID를 생성 할 수 있습니다.

하지만, 당신이 시도하지 수 :

<div ng-repeat="claim in claims"> 
    <div ng-click="claim.myVar1=!claim.myVar1" ng-class="{open : claim.myVar1}"> 
    </div> 
</div> 

당신과 함께 DIV 놓습니다 NG-중계기 래퍼 내에서 NG를 클릭합니다. 당신이 너 claim in claims이기 때문에 이전에했던 것처럼 주장에 대한 변수를 설정할 수 있습니다. 당신이 반복 사업부에 대한 가시성을 전환해야하는 경우

Answer 3

, 당신은 같은 수행 할 수 있습니다

<div ng-click="claim.isOpen=!claim.isOpen" ng-class="{open : claim.isOpen}" ng-repeat="claim in claims" ng-init="claim.isOpen = false"> 

설명 :

NG-초기화 각 반복 주장에 "ISOPEN"변수를 초기화한다 (이를 대신 JS 끝에 대신 수행해야합니다). 그러면 ng-click은 isOpen 변수를 토글합니다. 그런 다음 ng-class는 해당 변수의 변경 사항을 감시합니다.