Improve this Doc View Source ngModelOptions
- directive in module ng
Allows tuning how model updates are done. Using ngModelOptions
you can specify a custom list of events that will trigger a model update and/or a debouncing delay so that the actual update only takes place when a timer expires; this timer will be reset after another change takes place.
Given the nature of ngModelOptions
, the value displayed inside input fields in the view might be different from the value in the actual model. This means that if you update the model you should also invoke $rollbackViewValue
on the relevant input field in order to make sure it is synchronized with the model and that any debounced action is canceled.
The easiest way to reference the control's $rollbackViewValue
method is by making sure the input is placed inside a form that has a name
attribute. This is important because form
controllers are published to the related scope under the name in their name
attribute.
Any pending changes will take place immediately when an enclosing form is submitted via the submit
event. Note that ngClick
events will occur before the model is updated. Use ngSubmit
to have access to the updated model.
ngModelOptions
has an effect on the element it's declared on and its descendants.
Directive Info
- This directive executes at priority level 0.
Usage
- as attribute:
<ANY ng-model-options="Object"> ... </ANY>
Arguments
Param | Type | Details |
---|---|---|
ngModelOptions | Object | options to apply to the current model. Valid keys are:
|
The following example shows how to override immediate updates. Changes on the inputs within the form will update the model only when the control loses focus (blur event). If escape
key is pressed while the input field is focused, the value is reset to the value in the current model.
This one shows how to debounce model changes. Model will be updated only 1 sec after last change. If the Clear
button is pressed, any debounced action is canceled and the value becomes empty.
This one shows how to bind to getter/setters:
© 2010–2017 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.4.14/docs/api/ng/directive/ngModelOptions