6

아코디언 그룹이 열려 있는지 여부를 액세스 할 수있는 방법이 있습니까? 나는 isOpen 지시자가 있다는 것을 알고 있지만 순전히 html 안에있는 동안 그것의 상태에 접근하는 방법이 있는지 확실하지 않다. 두 가지 방식의 바인딩을 사용하면 (또는 악용하는) 변수를 설정하여 해당 상태를 유지할 수 있지만 isOpen0, isOpen1, isOpen2 등과 같은 작업을 수행하지 않아도 중첩 된 아코디언은 작동하지 않습니다. 또한 ng-init을 사용하여 "선언" 새 isOpen은 중첩 된 아코디언의 범위에 있지만 좋은 생각처럼 들리지는 않습니다.Angularjs Accordion Access isOpen 상태

<accordion> 
    <accordion-group is-open="isOpen"> 
     <accordion-heading> 
     <div ng-class="{'myClass': isOpen}">Static Text</div> 
     </accordion-heading> 
     This content is straight in the template. 
    </accordion-group> 
    </accordion> 

http://plnkr.co/edit/l5y4raei99pedNWcE225

답변

11

먼저 부모 객체 like in Angular UI's docs' example, 예를 들어 status 개체를 사용해야합니다 : 다음

<div accordion-group="" ng-init="status = {isOpen: false}" is-open="status.isOpen"> 
     <div accordion-heading=""> 
      <div ng-class="{'is-open': status.isOpen}">NUTRIENT PROFILES</div> 
     </div> 
     ... 
    </div> 

을, 당신은 완벽하게 중첩 된 아코디언에 동일한 개체 이름을 사용할 수 있습니다 . 이유는 간단합니다. accordion-group 지시문은 각 그룹에 대해 새 범위를 인스턴스화합니다. 이렇게하면 status.isOpen이 변경되면 다른 그룹에는 영향을 미치지 않습니다.

확인할 사항 : http://plnkr.co/edit/nJ654pvE1itnGDQGp2rk?p=preview

+0

큰 방법으로 작동합니다. ** ng-repeat ** iteration에서, 첫 번째 요소를 열기 위해'ng-init = "status = {isOpen : $ first}"'로 대체 할 수도 있습니다. –