Question

我试图在使用AngOJ的选择字段上使用AngularJS的ngModel指令的链接回调期间运行一些代码。

module.directive("ngModel",function(){
    console.log('ng-model called');
    return {
      restrict: 'A',
      priority: -1, // give it lower priority than built-in ng-model
      link: function(scope, element, attr) {
         console.log('watching');
         scope.$watch(attr.ngModel,function(value){                
            if (value){
                console.log("changing");
            }
         });
       }
     }
});

看到这个小提琴演示了这个问题： http://jsfiddle.net/d3r3zwLj/3/

第一个选择字段使用ng-options填充，而第二个选项字段的选项是用html明确写出的。如果你打开控制台，你会看到你只看到＆＃34;更改＆＃34;更改第二个选择字段时出现错误信息。改变第一个没有任何作用。

您还会立即注意到您只看到名为＆＃39;的模型。并且＆＃39;观看＆＃39;曾经，即使有两个带有ng-model的字段。

我希望ngModel指令能够同时处理两个选择字段。什么是ng-options正在阻止ngModel工作？

谢谢！

Answer 1

查看ng-options的文档： https://docs.angularjs.org/api/ng/directive/ngOptions

“指令信息此指令在优先级0执行。”

如果将指令的优先级更改为0，则会成功运行。我不确定那里有什么影响，但这就是它发生的原因。

Answer 2

当您使用ng-options指令时，它有另一个可选的ng-model指令，它实际上设置了从选项中显示的默认值。因此，在您的情况下，第二个列表没有ng-options指令，这使得ng-model看起来像常规的。也许您只需更改指令的名称即可。

Answer 3

这是更新内置指令功能的一种不好方法，decorators就是为了这个目的。查看documentation

带选择字段和ngOptions的AngularJS ngModel指令

3 个答案: