Angular JS中点击关闭输入框事件

Question

假设您在 Angular JS 应用程序中有一个输入字段

 <input id="title" type="text" name="title" placeholder="enter a title" ng-model="item.title" />

我想在用户完成与输入的交互后向用户显示一些关于输入数据有效性的反馈，但我想不出观看 "click off" 事件的指令。也就是说，当用户在表单中键入内容时，然后选择下一个选项卡或单击其他任何地方。

如何捕获 "click off and element" 事件。

请注意，这与 "off-click" 事件形成对比，后者是指用户点击指定元素以外的任何地方。

Answer 1

您需要使用 ng-blur 指令。

ng-模糊:

Specify custom behavior on blur event.

A blur event fires when an element has lost focus.

注： 你在ng-blur中看到的打印不过是console.log为了方便使用这个，参考我的fiddle!

JSFiddle Demo

JS:

<div ng-controller='MyController' ng-app="myApp">
  <input id="title" type="text" name="title" placeholder="enter a title" ng-model="item.title" ng-blur="print('lost focus')" />
</div>

参考文献：

ng-blur

Answer 2

如 Naren 的回答中所述，ngBlur 是您正在寻找的指令。

但是，由于您正在尝试实施验证，因此您应该知道 angular 具有内置的验证功能，可以为您处理事件，使用它们比重新发明验证更好'wheel'.

使用 ngRequired、ngMinlength、ngMaxlength 和 ngPattern 等验证指令来满足简单的验证需求。

https://docs.angularjs.org/guide/forms

使用 Angular UI 的 uiValidate 指令进行自定义验证，包括通过异步 http 请求进行验证。

https://github.com/angular-ui/ui-validate

Angular JS中点击关闭输入框事件

Click off input field event in Angular JS

javascript

mouseclick-event

angularjs