title: angular-ui-bootstrap accordion collapse/expand all
body: <p>I would like to create a collpase/expand all button for a set of accordions. I am using angular.js v1.2.6 and angular-bootstrap-ui 0.9.0. I haven't been able to find an example of how to do a collpase/expand all. I'm an angular novice and any advice or suggestions is appreciated.</p>
  
  <p>ALSO, I should add that the solution in <a href="https://stackoverflow.com/questions/19237993/expand-many-accordion-groups-at-once?rq=1">this post</a> doesn't work in the newer version of angular.js (v1.0.8 vs v1.2.6) that I am using (which is a latest version at the time of this posting). In the newer version it throws an error about trying to create two isolated scopes.</p>
  
  <p>Markup:</p>
  
  <pre><code>    &lt;div ng-controller="myCtlr"&gt;
  
       &lt;accordion close-others="oneAtATime"&gt;
  
       &lt;button class="btn" ng-click="section.isCollapsed = !section.isCollapsed"&gt;Toggle Sections&lt;/button&gt;
  
        &lt;accordion-group ng-repeat="section in sections" is-open="section.isOpen"&gt;
         &lt;accordion-heading&gt;
          &lt;div class="accordion-heading-content" ng:class="{collapsed: section.isOpen}"&gt;
            {{section.name}}
          &lt;/div&gt;
         &lt;/accordion-heading&gt;
          Section content
        &lt;/accordion-group&gt;
  
       &lt;/accordion&gt;
  
     &lt;/div&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>var theapp = angular.module('myApp', [
    'ui.bootstrap'
  ])
  
  function myCtlr ($scope) {
   $scope.isCollapsed = false;
   $scope.sections = [
      {'id': '353','otherid': '7','name': 'One','Sequence': '1'},
      {'id': '354','otherid': '8','name': 'Two','Sequence': '1'},
      {'id': '355','otherid': '9','name': 'Three','Sequence': '1'}
  ];
  
  }
  </code></pre>