提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  前端

当前栏目

[AngularJS] Angular 1.3: ng-model-options updateOn, debounce

Angular model 1.3 angularjs NG Options debounce
2023-09-14 09:00:55 时间 
<!DOCTYPE html>
<html ng-app="app">
<head lang="en" >
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>AngularJS 1.3 ng-model-options</title>
</head>
<body ng-controller="MainCtrl as vm">

<form name="myForm" novalidate>
    <label>
        Some input:
        <input
                type="text"
                name="myField"
                ng-model="vm.inputValue"
                ng-model-options="vm.modelOptions"
                required />

    </label>
    <button type="submit">Submit</button>
</form>

Bound value: <span ng-bind="vm.inputValue"></span> <br />
Field Error State: <pre>{{myForm.myField.$error | json}}</pre> <br />
Form Error State: <pre>{{myForm.$error | json}}</pre>
myForm.$submitted: {{myForm.$submitted}}

<script src="bower_components/angular/angular.min.js"></script>
<script src="app.js"></script>
</body>
</html>
/**
 * Created by Answer1215 on 11/13/2014.
 */

function MainCtrl(){
    var vm = this;

    vm.inputValue = "";
    vm.modelOptions = {
        updateOn: 'default blur',
        debounce: {
            default: 1200, //for search we don't want to update server during user type
            blur: 0 //when user move on to the next field, we update immedately
        }
    };
}

angular
    .module('app', [])
    .controller('MainCtrl', MainCtrl);

 

Read More: https://egghead.io/lessons/angularjs-new-in-angular-1-3-ng-model-options-updateon-and-debounce

相关文章