Angularjs ng-model-options Instruction
Angularjs instance
The value of the bound input box to the scope variable when the focus is lost:
<! DOCTYPE html>
<html>
<head>
<meta charset = "utf-8">
<script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ script>
</ head>
<body>
<div ng-app = "myApp" ng-controller = "myCtrl">
<p> Update input box: </ p>
<input ng-model = "name" ng-model-options = "{updateOn: 'blur'}">
<p> When the focus is lost, bind the value of the input box to the scope variable: </ p>
{{name}}
</ div>
<script>
var app = angular.module ('myApp', []);
app.controller ('myCtrl', function ($ scope) {
$ scope.name = "John Doe";
});
</ script>
<p> This example demonstrates how to use the ng-model-options directive to bind the value of the input box to the scope variable when the focus is lost. </ p>
</ body>
</ html>
Definitions and usage
The ng-model-options directive binds an HTML form element into a scope variable
You can specify the time that the binding data is triggered, or specify how many milliseconds to wait, and the parameter settings can refer to the following instructions.
Grammar
<element ng-model-options= "option" ></element>
<input>, <select>, <textarea>, the element supports the directive.
Parameter values
| value | Description |
|---|---|
| Option | The rules for binding data are specified, as follows: {updateon: ' event '} rule specifies binding data after event occurrence {debounce:1000} Specify how many milliseconds to wait to bind data {Allowinvalid:true|false} requires validation of binding data {Gettersetter:true|false} is required to bind to the model as Getters/setters {timezone: ' 0100 '} rule whether time zone is used |
The above is the Angularjs ng-model-options instructions of the data collation, follow-up continue to supplement the relevant information.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
