title: Angularjs UI collapse in ngRepeat
body: <p>I am trying to embed some collapsible panels in a ngRepeat.
  This is what I have:</p>
  
  <pre><code>&lt;div class="panel panel-default" ng-repeat="element in elements"&gt;
   &lt;div class="panel-heading"&gt;
    {{element.name}}
    &lt;button value="Collapse" ng-click="element.isCollapsed != element.isCollapsed"&gt;&lt;/button&gt;
   &lt;/div&gt;
   &lt;div class="panel-body" collapse="element.isCollapsed"&gt;
    Content
   &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Now, when I click on the button, the collapse doesn't work.
  From the documentation I understand that the repeater creates a scope for every <code>element</code>.
  And the attribute <code>collapse</code> of the panel-body should get the same scope, right?
  It seems that the <code>scope.$watch</code> in the <code>collapse</code> directive is not working properly.
  Or maybe I'm doing something wrong?</p>
  
  <p>Thanks</p>