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

<!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);

posted @ 2014-11-14 04:17 Zhentiw 阅读(572) 评论(0) 编辑收藏举报

刷新页面返回顶部

（评论功能已被禁用）

公告

昵称： Zhentiw
园龄： 13年2个月
粉丝： 41
关注： 0

+加关注

2025年3月

日

一

二

三

四

五

六

Answer1215

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

公告

常用链接

最新随笔

积分与排名

随笔分类

随笔档案

阅读排行榜

评论排行榜