AngularJS UI-單擊按鈕時，如果存在多個div，則折疊單個div

Question

假設我有以下代碼：

  <button class="btn btn-primary" ng-click="isCollapsed = !isCollapsed">Button1</button>
  <div id="collapse1" collapse="isCollapsed">
    <div class="well well-small">
      <p ng-bind-html="b2data"></p>
    </div>
  </div>

  <button class="btn btn-primary" ng-click="isCollapsed = !isCollapsed">Button2</button>
  <div id="collapse2" collapse="isCollapsed">
    <div class="well well-small">
      <p ng-bind-html="b2data"></p>
    </div>
  </div>

如何分別折疊每個人？ http://plnkr.co/edit/W26X4Iq8KrnY9cGsFvwA?p=preview

Answer 1

試試看： -http : //plnkr.co/edit/vPbihuL6JBE6qhwy4irP?p=preview

HTML：-

  <div ng-controller="AccordionDemoCtrl">

    <accordion-group heading="Static Header">
      <button class="btn btn-primary" ng-click="isCollapsed1= !isCollapsed1">Button1</button>
      <hr>
      <div id="collapse2" collapse="isCollapsed1">
        <div class="well well-small">
          <p ng-bind-html="b2data"></p>
        </div>
      </div>

      <button class="btn btn-primary" ng-click="isCollapsed2 = !isCollapsed2">Button2</button>
      <hr>
      <div id="collapse2" collapse="isCollapsed2">
        <div class="well well-small">
          <p ng-bind-html="b2data"></p>
        </div>
      </div>
    </accordion-group>

  </div>