angular-ui bootstrap 手風琴：如何正確 $watch is-open 屬性？

Question

當特定的手風琴部分打開時，我正在嘗試執行一個操作。 我的用例幾乎與這里的這個問題相同，只是我使用的是靜態定義的而不是 ng-each。

不知何故，當 is-open 狀態改變時，我無法讓 $watch 觸發，誰能告訴我為什么這不起作用：

看法：

  <accordion close-others="false">
   <accordion-group heading="group1" is-open="acc1open">
    content 1
   </accordion-group>    
   <accordion-group heading="group2" is-open="acc2open">
    content 2
   </accordion-group>  
  </accordion>  

控制器：

  $scope.acc1open = false;
  $scope.acc2open = true;

  $scope.$watch('acc1open', function(){
      console.log("watch acc1:" +$scope.acc1open);
  }, true);

這是一個plunker：

https://plnkr.co/edit/Ycms81?p=preview

它在頁面加載時打印一次“watch acc1:false”，但在打開手風琴組時不打印。

Answer 1

與plunker一起： plnkr.co/edit/1lnbTa? p= preview

我發現這適用於數組：

JS

$scope.array = [object1,object2,object3,object4];
$scope.isOpen = [false,false,false,false];
$scope.$watch('isOpen', function() {
  console.log("watch isOpen:" + $scope.isOpen);
}, true);

HTML(翡翠)

accordion-group(ng-repeat='object in array',is-open="$parent.isOpen[$index]")
  accordion-heading
    h4 My Heading {{$index}}
  p My content {{$index}}

Answer 2

我在 AccordionDemoCtrl div 中添加了一個<span>並將 is-open 更改為綁定到 $parent.acc1open

<accordion-group heading="group1" is-open="$parent.acc1open">

...

<span ng-click="acc1open = true">Click me to open group 1</span>

指令有它們自己的作用域，而變量是它們自己的。