2016-07-04 2 views
0

프로젝트에서 앵글 v- 아코디언을 사용하고 있습니다. v 내부에있는 버튼에만 cliked 될 때 아코디언 축소를 다시 시도하는 rementsuriment가 있습니다. 헤더.v-pane-header 내의 버튼을 클릭하면 각도 v- 아코디언 비활성화가 해제됩니다.

이것은 샘플 코드입니다. 그리고 또한 codepen 링크를 incuded있다.

<v-accordion control="accordionA"> 

    <v-pane expanded="pane.isExpanded"> 
     <v-pane-header> 
     <h5>{{ ::pane.header }}</h5> 
     <button>Button</button> 
     </v-pane-header> 

     <v-pane-content> 
     <p>{{ ::pane.content }}</p> 
<v-pane-content> 
</v-pane> 
</v-accordion> 

Codepen 링크 : 사람이 .. 에 도움을 줄 수있는 경우 enter link description here

가 높은 감사는 사전에 감사합니다.

건배!.

답변

0

버튼에 추가 클릭하십시오. 버튼이 true로 일부 부울 플래그를 전환하는 함수를 호출합니다 :

$scope.stopCollapsing = false; 
$scope.toggleCollapse = function(){ 
    $scope.stopCollapsing = true; 
} 

는 그런 다음에 추가를 if 문 collapseCallback :

$scope.collapseCallback = function (index, id) { 
    if($scope.stopCollapsing){ 
     $scope.accordionA.toggle(index); 
    } 
    console.log('collapse:', index, id); 
    }; 

을 그리고 그것 뿐이다. 이제는 어디에서나 stopCollapsing을 전환하여 축소를 방지 할 수 있습니다. 업데이트 코드는 다음과 같습니다. http://codepen.io/anon/pen/GrxEqQ