AngularJS 1.2.0-rc.2 vs 1.2.0元素绑定

我最近将我的AngularJS框架从1.2.0-rc.2升级到了1.2.0版本,并遇到了一个奇怪的问题,我还没有找到解决办法。 我之前解决的问题是强制输入字段触发on-blur事件而不是on-change事件。 我最初使用的指令的代码是:

angular.module('app', []).directive('ngModelOnblur', function() { return { restrict: 'A', require: 'ngModel', link: function(scope, elm, attr, ngModelCtrl) { if (attr.type === 'radio' || attr.type === 'checkbox') return; elm.unbind('input').unbind('keydown').unbind('change'); elm.bind('blur', function() { scope.$apply(function() { ngModelCtrl.$setViewValue(elm.val()); }); }); } }; }); 

这只是使用此处的建议https://groups.google.com/forum/?fromgroups#!searchin/angular/change$20blur/angular/LH0Q1A-qTVo/eyVIjJsFZGcJ

我创建了两个jsFiddles,一个在这里使用AngularJS 1.2.0-rc.2,另一个在这里使用AngularJS 1.2.0。

ngModleOnBlur指令应该从元素中删除'change'绑定并添加一个显式的'blur'绑定。

你会注意到小提琴的行为有所不同,比如elm.bind('blur', function(){...})的绑定elm.bind('blur', function(){...})实际上并没有正确地绑定到元素上,而且似乎是elm.unbind('input').unbind('keydown').unbind('change')在1.2.0中的工作方式不同。

我知道新的ng-blur指令,但在我的情况下我不能直接使用它,但需要手动覆盖绑定到元素的事件。 如果有人可以发布一个如何手动覆盖绑定到元素的事件的工作jsfiddle,和/或解释为什么它已经从1.2.0-rc.2更改为1.2.0,那将是非常有帮助的。

它与指令的评估顺序有关。

侦听DOM元素事件的input指令实际上是在您的指令之后执行的。 只需添加

 priority: 1 

到您的指令定义。 输入指令的默认优先级为0。

这是更新的小提琴

http://jsfiddle.net/yC627/

然而,奇怪的是文档明确指出了这一点

 Directives with greater numerical priority are compiled first. 

但是玩弄它,似乎恰恰相反。 我不能告诉你为什么会这样。 希望其他人可以加入。

编辑:我查看了更改日志,它似乎来自这个变化

https://github.com/angular/angular.js/blob/master/CHANGELOG.md#breaking-changes-1

应该真正更新文档以反映这一点。 与预链接或编译function相比,后链接function以反向优先级顺序解析。

我实现了分叉和更新你的小提琴再次使用1.2.0。 这是你想到的行为吗? http://jsfiddle.net/P2q6B/2/

  angular.module('app', []).directive('ngModelOnblur', function() { return { restrict: 'A', require: '?ngModel', priority: 99, link: function(scope, elm, attr, ngModel) { if(!ngModel) return; // do nothing if no ng-model if (['radio', 'checkbox'].indexOf(attr.type) > -1) return; elm.unbind('input').unbind('keydown').unbind('change'); //ui->model elm.on('blur', function() { scope.$apply(read.call(this)); }); function read() { ngModel.$setViewValue(elm.val()); } } }; }); 

如果是这样,我的解决方案就是读取angular.js源代码,特别是搜索contenteditable(约16k行;)

这个问题似乎是相关的: AngularJS – 创建一个使用ng-model的指令