输入未从angular指令触发的事件

时间:2014-06-22 22:02:03

标签: javascript angularjs jqlite

为什么在标记的输入元素失去焦点时,我从角度指令添加到输入元素的此更改事件未被触发?

更新:jqlite docs say - " jQuery支持的操作的子集当前已实现" ...并且它们在事件处理程序下专门列出.change。目前的答案与此相矛盾,但我希望听到作者明确表示"文档错误"或者#34;您对文档的理解是错误的"。目前看起来他们已经撇去前几行并且没有进一步。没有人知道我是否采用了不同的方式实际存在另一个我无法抓住的错误,我可以很容易地重新制作。

app.directive('changeDirective', function() {
  return {
    link: function(scope, elem, attrs) {
      return elem.change(function() {
        alert("Change!");
      });
    }
  };
});

<html ng-app="plunker">
  <head>
    <script data-require="angular.js@1.2.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js" data-semver="1.2.17"></script>
    <script src="app.js"></script>
  </head>
  <body>
    input with change listener<input type="text" change-directive="true">
    <br/>
    select this to remove focus from other input <input type="number">
  </body>
</html>

Plunkr

2 个答案:

答案 0 :(得分:0)

Angular.js使用jqLite作为jQuery替换,它没有jQuery的所有功能。

  

jqLit​​e是一个微小的,API兼容的jQuery子集,允许使用Angular   以跨浏览器兼容的方式操作DOM。 jqLit​​e   仅实现目标最常用的功能   占地面积很小。

请尝试使用on方法:

return elem.on('change', function() {
    alert("Change!");
});

Plunker Link

检查this link以获取有关angular.element

的更多信息

Here is a list of all jqLite functions

答案 1 :(得分:0)

首先,AngularJS使用jqLite,它是jQuery的一个子集,不包含.change方法。您应该使用.on代替。

其次,当元素失去焦点时,change事件不会触发。请改用blur事件。如果您使用blur方法,则可以同时使用change.on个事件。

<强>代码:

return elem.on('blur change', function() {
    alert('Change!');
});

Demo on Plunker