title: angular-ui bootstrap accordion: How do I properly $watch the is-open attribute?
body: <p>I'm trying to perform an action when a specific accordion-section is openend. My use-case is almost identical to this <a href="https://stackoverflow.com/questions/15642082/handle-open-collapse-events-of-accordion-in-angular">question here</a>, only I'm using statically defined 's instead of ng-each.</p>
  <p>Somehow I can't get the $watch to fire when the is-open state changes, can anybody tell me why this doesn't work:</p>
  <p>View:</p>
  <pre><code>  &lt;accordion close-others=&quot;false&quot;&gt;
     &lt;accordion-group heading=&quot;group1&quot; is-open=&quot;acc1open&quot;&gt;
      content 1
     &lt;/accordion-group&gt;    
     &lt;accordion-group heading=&quot;group2&quot; is-open=&quot;acc2open&quot;&gt;
      content 2
     &lt;/accordion-group&gt;  
    &lt;/accordion&gt;  
  </code></pre>
  <p>Controller:</p>
  <pre><code>  $scope.acc1open = false;
    $scope.acc2open = true;
  
    $scope.$watch('acc1open', function(){
        console.log(&quot;watch acc1:&quot; +$scope.acc1open);
    }, true);
  </code></pre>
  <p>Here's a plunker:</p>
  <p><a href="https://plnkr.co/edit/Ycms81?p=preview" rel="nofollow noreferrer">https://plnkr.co/edit/Ycms81?p=preview</a></p>
  <p>It prints &quot;watch acc1:false&quot; a single time when the page is loaded, but nothing when the accordion group is opened.</p>