使用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 ，尽管该函数的输出正在更改。

Answer 1

如果要监视范围内的属性，请轻松执行以下操作：

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

而且，由于您已经在element-is-active="elementIsActive(key)"调用了该函数，因此可以在范围内将其返回值作为普通变量获取：

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

看看这个矮子 。