通过Ng重复指令监视控制器中函数的输出

Watching the Output of a Function in a Controller From Directive with Ng-Repeat

本文关键字：函数 输出 控制器 监视 Ng 指令 通过      更新时间：2023-09-26

我很难获得自定义指令来查看绑定到控制器中作用域的函数的结果。

这是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，尽管函数的输出正在改变。

如果您想监视作用域中的属性，请轻松执行以下操作：

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

由于您已经在element-is-active="elementIsActive(key)"中调用了该函数，因此您可以将其返回值作为作用域中的一个普通变量：

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

看看这个笨蛋。

相关文章：