Question

我有一个指令，用于监视输入字段中的更改

directive('autocomplete', function(){
    return {
        link: function(scope, element, attrs){
            scope.$watch(attrs.ngModel, function(){
                console.log('change');
            });
        }
    };
});

这适用于以下元素

<input type='text' ng-model='searchTerm' autocomplete>

但是，如果我将我的指令放在一个祖先元素上，如下所示：

<div autocomplete>
    <input type='text' ng-model='searchTerm'>
</div>

我怎么还能看到输入的变化呢？

Answer 1

简单地说：你可以，但你不应该。

首先，ngModel指令有一个controller。它的$viewChangeListeners属性可能是您真正想要使用的属性（因为您的＆＃34;自动完成＆＃34;指令可能只会查看视图值的变化）。您可以将更改侦听器推送到该阵列中。

第二个（更重要的是），你不应该只从祖先元素那里引导那种功能。如果您希望与ngModel进行互动，您最好将您的指令正确地放在使用它或其后代的元素上（而不是<input>的选项）。这并不能阻止您在祖先上放置一些共同的逻辑并与该祖先进行交互（很像ngModel与ngForm交互）。

如果你不关心应该和不应该，你可以随时

在您的输入上加name并从ngModelController获取ngForm（如果您的指令在其下），或
找到<input>并使用ngModelController获取angular.element(...).controller('ngModel')。

在父元素的指令中观察ngModel值的变化

1 个答案: