접을 수있는 패널이 제대로 작동하지 않습니다.

Question

ng-repeat에 항목 목록이 있기 때문에 패널에 동적 데이터 대상 및 ID를 만들지 만 접을 수있는 패널이 아닌 패널 축소와 관련된 문제가 있습니다.

$scope.fngetQList = function(topics,index) { 
     $scope.index = index; 
    }; 

항목의 배열은 예를 들어하기와 같다 : [ "HTML", "CSS"

<div class="row"> 
    <div class="col-xs-4" ng-repeat="topics in oJdDetails.topics"> 
     <a style="cursor:pointer" data-toggle="collapse" data-target="{{'#'+'collapse'+'_' + $index}}" ng-click="fngetQList(topics,$index)"> 
      <p class="col-xs-3">{{topics}}</p> 
      <span class="glyphicon glyphicon-plus-sign col-xs-1" aria-hidden="true"></span> 
     </a> 
    </div> 
</div> 
<div id="{{'collapse'+'_' + index}}" class="panel-collapse collapse"> 
    <div class="panel-body"> 
     <div class="col-sm-6"> 
      <div class="panel panel-default"> 
       <div class="panel-heading"> 
        <p class="col-xs-6">Question Lists</p> 
        <div class="input-group col-xs-6"> 
         <input type="text" class="form-control" ng-model="search" ng-change="fnSearchQList(search)"> 
         <span class="input-group-addon"><span class="glyphicon glyphicon-search" data-toggle="tooltip" data-placement="bottom" title="Search question " activetooltip aria-hidden="true"></span></span> 
        </div> 
       </div> 
       <div class="panel-body"> 
        <button class="btn btn-primary pull-right" ng-click="fnshowInputQList()"> 
         <div class="row"> 
          <span class="col-xs-8">Add Question List</span><span class="glyphicon glyphicon-plus-sign col-xs-4" aria-hidden="true"></span> 
         </div> 
        </button> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

컨트롤러 코드는 아래와 같다 : 트리거 패널 여기 의 범위에서 HTML 코드 , "각도"]

내가 뭘 잘못하고 있는지 잘 모르겠지만 첫 번째 항목을 클릭하면 패널이 "축소"클래스로 열리고 있지만 두 번째 항목을 클릭하면 여전히 "붕괴"클래스가 결과를 첨부합니다 패널을 열지 않고 패널을 닫을 때

작업 예 : 어떤 도움을 주시면 감사하겠습니다 http://jsfiddle.net/Lvc0u55v/6625/

.

Answer 1

이것이 맞는지는 모르겠지만 원하는대로하는 것은 아닙니다. 내가

<div ng-controller="MyCtrl"> 
    <div class="row"> 
     <div class="col-xs-4" ng-repeat="topics in topics"> 
     <a style="cursor:pointer" data-toggle="collapse" data-target="{{'#'+'collapse'+'_' + $index}}" ng-click="fngetQList(topics,$index)"> 
      <p class="col-xs-3">{{topics}}</p> 
      <span class="glyphicon glyphicon-plus-sign col-xs-1" aria-hidden="true" /> 
      <div id="{{'collapse'+'_' + $index}}" class="panel-collapse collapse"> 
       <div class="panel-body"> 
        <div class="col-sm-6"> 
        <div class="panel panel-default"> 
         <div class="panel-heading"> 
          <p class="col-xs-6">Question Lists</p> 
         </div> 
         <div class="panel-body"> 
          <button class="btn btn-primary pull-right">Click here</button> 
         </div> 
        </div> 
        </div> 
       </div> 
      </div> 
     </a> 
     </div> 
    </div> 
</div>