且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

在用户离开字段后验证字段

更新时间:2023-12-01 19:48:58

Angular 1.3 现在有 ng-model-options,你可以将选项设置为 { 'updateOn': 'blur'}例如,你甚至可以去抖动,当用户输入太快,或者你想保存一些昂贵的 DOM 操作时(比如一个模型写入多个 DOM 位置,你不希望 $digest 循环发生在每个键下)

Angular 1.3 now has ng-model-options, and you can set the option to { 'updateOn': 'blur'} for example, and you can even debounce, when the use is either typing too fast, or you want to save a few expensive DOM operations (like a model writing to multiple DOM places and you don't want a $digest cycle happening on every key down)

https://docs.angularjs.org/guide/forms#custom-triggershttps://docs.angularjs.org/guide/forms#non-immediate-debounced-model-更新

默认情况下,对内容的任何更改都会触发模型更新和表单验证.您可以使用ngModelOptions 指令仅绑定到指定的事件列表.IE.ng-model-options="{ updateOn: 'blur' }" 将更新和验证只有在控件失去焦点之后.您可以使用一个设置多个事件空格分隔的列表.IE.ng-model-options="{ updateOn: 'mousedown模糊'}"

By default, any change to the content will trigger a model update and form validation. You can override this behavior using the ngModelOptions directive to bind only to specified list of events. I.e. ng-model-options="{ updateOn: 'blur' }" will update and validate only after the control loses focus. You can set several events using a space delimited list. I.e. ng-model-options="{ updateOn: 'mousedown blur' }"

去抖动

您可以使用 debounce 键延迟模型更新/验证使用 ngModelOptions 指令.此延迟也适用于解析器、验证器和模型标志,如 $dirty 或 $pristine.

You can delay the model update/validation by using the debounce key with the ngModelOptions directive. This delay will also apply to parsers, validators and model flags like $dirty or $pristine.

即ng-model-options="{ debounce: 500 }" 会等待半秒自触发模型更新之前的最后一次内容更改以来表单验证.

I.e. ng-model-options="{ debounce: 500 }" will wait for half a second since the last content change before triggering the model update and form validation.