使用Ng-Repeat從指令中監視控制器中的功能輸出

Question

我很難獲得自定義指令來觀察綁定到控制器中的作用域的函數的結果。

這是html。我將ng-repeat的密鑰傳遞給控制器​​中的函數，以決定此元素是否處於活動狀態。

<div ng-repeat="(key, value) in myArray" my-custom-directive element-is-active="elementIsActive(key)"> 
</div> 

這是控制器中的相關代碼。根據用戶的輸入，此函數返回true或false，指示元素是否被選中。

$scope.elementIsActive = function (key) { 
    if(key===$scope.selectedElement) { 
     return true; 
    } 
    return false; 
} 

如果此元素是活動的，我想使用自定義指令中的功能。這是自定義指令：

myAngularModule.directive('myCustomDirective', function(){ 

    function link (scope, element, attrs) { 

     scope.$watch(scope.active(), function(){ 
      console.log("triggered"); 
     }); 

    } 

    return { 
     link:link, 
     scope: { 
      active: "&elementIsActive" 
     } 
    } 

}) 

我有麻煩$watch工作。 "triggered"僅在加載時輸出一次，然後似乎停止$watch ing，儘管該函數的輸出正在改變。

Answer 1

如果你想觀看超過範圍的屬性，很容易做到這一點：

scope.$watch('active', function(){ 

而當你已經在element-is-active="elementIsActive(key)"調用該函數，你可以得到它的返回值作爲一個正常的變量您範圍：

return { 
    link:link, 
    scope: { 
     active: "=elementIsActive" 
    } 
} 

看看this plunker。