javascript - angularjs expand all accordion inside ng-repeat -

i getting data service, number of accordions variable. used ng-repeat dynamically display accordion

<div ng-controller = "groupcontroller">  <div ng-repeat = "groups in groupnames">     <div class = "panel-group" id = "accordion">     <div class = "panel panel-default">         <div class="panel-heading">         <div class = "panel-title">             <a data-toggle= "collapse" data-parent="#accordion" href="#collapse{{$index}}"> {{groups.team}} </a>         </div>         </div>          <div id="collapse{{$index}}" class = "panel-collapse collapse">         <div class = "panel-body">             <!-- display data in panel body -->         </div>         </div>      </div>      </div> </div>  <button class = "btn btn-primary">collapseall</button> <button class = "btn btn-primary">expandall</button>  </div> 

how achieve collapse , expand using controller. answers found solved accordion provided ui-bootstrap. in particular how manipulate hrefs in angularjs collapse , expand all?

at first should remember set close-others=false accordion, because in ui-bootstrap close-others=true default means can expand 1 group @ time.

then can control is-open property of accordion-group binding variable in controller. , link buttons function in controller set these variables true or false.

here example on plunker.