[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);
Read More: https://egghead.io/lessons/angularjs-new-in-angular-1-3-ng-model-options-updateon-and-debounce
[AngularJS] Angular 1.3: ng-model-options updateOn, debounce的更多相关文章
- AngularJs学习笔记--Understanding the Model Component
原版地址:http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model 在angular文档讨论的上下文中,术语“model”可以 ...
- Angularjs 学习笔记-2017-02-05-初识Angular及app、model、controller、repeat指令和fileter、orderBy
ng-app 定义作用域,从作用域处开始执行ng命令指令 ng-model 数据绑定字符,用于双向数据绑定 ng-controller ng控制台,定义function name($scope)来 ...
- angularjs中常用的ng指令介绍【转载】
原文:http://www.cnblogs.com/lvdabao/p/3379659.html 一.模板中可使用的东西及表达式 模板中可以使用的东西包括以下四种: 指令(directive).ng提 ...
- [AngularJS] Angular 1.3 ngMessages with ngAnimate
Note: Can use $dirty to check whether user has intracted with the form: https://docs.angularjs.org/a ...
- [AngularJS] Angular 1.3 $submitted for Form in Angular
AngularJS 1.3 add $submitted for form, so you can use $submitted to track whether the submit event ...
- [AngularJS] Angular 1.3 ng-model-options - getterSetter
getterSetter: boolean value which determines whether or not to treat functions bound to ngModel as ...
- AngularJs angular.element
angular.element 将DOM元素或者HTML字符串一包装成一个jQuery元素. 格式:angular.element(element); element:包装成jquery对象的html ...
- AngularJs angular.bind、angular.bootstrap、angular.copy
angular.bind 返回一个调用self的函数fn(self代表fn里的this).可以给fn提供参数args(*).这个功能也被称为局部操作,以区别功能. 格式:angular.bind(se ...
- [Angularjs]angular ng-repeat与js特效加载先后导致的问题
写在前面 最近在项目中遇到这样的一个前端的bug,在ng-repeat中绑定的图片,有一个晃动的特效,在手机端浏览的时候,图片有时候会正常展示,有时就展示不出来.当时猜测是因为angularjs与特效 ...
随机推荐
- poj1789(prim)
prim和kruskal都是求解最小生成树的算法.这道题题意就是有N个字符串就是N个节点,而字符串之间的距离就是节点边的长度,求其最小生成树的边权和. 由于是第一次用prim,所以在求安全边的时候采用 ...
- Kail Linux渗透测试教程之免杀Payload生成工具Veil
Kail Linux渗透测试教程之免杀Payload生成工具Veil 免杀Payload生成工具——Veil Kail Linux渗透测试教程之免杀Payload生成工具Veil,Veil是一款利用M ...
- 验证Xcode真伪的方法,来自苹果官网
验证Xcode真伪的方法,来自苹果官网 Xcode的验证你的版本 2015年9月22日 注意:中文为有道翻译,看下验证方法即可. 我们最近将应用程序从应用程序商店,还建有Xcode的假冒 ...
- Python 面向对象编程——初见
<什么是面向对象> 面向对象编程(Object Oriented Programming),简称OOP,是一种程序设计思想.OOP把对象作为程序的基本单元,一个对象包含了数据和操作数据的 ...
- WSDL语法
<什么是WSDL语言> WSDL(网络服务描述语言,Web Services Description Language)是一门基于 XML 的语言,用于描述 Web Services 以及 ...
- JMS介绍:我对JMS的理解和认识
[ZT]JMS介绍:我对JMS的理解和认识 转自:http://blog.csdn.net/KimmKing/archive/2011/06/30/6577021.aspx,感谢作者KimmKing ...
- Codeforces 980 D. Perfect Groups
\(>Codeforces\space980 D. Perfect Groups<\) 题目大意 : 设 \(F(S)\) 表示在集合\(S\)中把元素划分成若干组,使得每组内元素两两相乘 ...
- BZOJ 4516: [Sdoi2016]生成魔咒 后缀自动机 性质
http://www.lydsy.com/JudgeOnline/problem.php?id=4516 http://blog.csdn.net/doyouseeman/article/detail ...
- [POJ1205]Water Treatment Plants
题目大意: 有一排n个格子,要在它们上面装管道. 每个格子上的管道都是T形的,但是可以有三种流动的方向. 每种都是把两个方向的水往另一个方向排出. 如果方向是向左或向右,就是排到相邻的格子里. 特别地 ...
- Codeforces Beta Round #9 (Div. 2 Only) C. Hexadecimal's Numbers dfs
C. Hexadecimal's Numbers 题目连接: http://www.codeforces.com/contest/9/problem/C Description One beautif ...