getterSetter:  boolean value which determines whether or not to treat functions bound to ngModel as getters/setters to have greater control over your model.

allowInvalid: boolean value which indicateds that the model can be set with values that did not validate correctly instead of the default behavior of setting the model to undefined.

For example input type="email".

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.min.js"></script>
<title>What's new in Angular 1.3</title>
</head>
<body ng-app="app" ng-controller="MainCtrl as vm">
<h1>Angular {{vm.angularVersion}}</h1>
<h2>
ngModelOptions
<small>by <a href="http://twitter.com/kentcdodds">@kentcdodds</a></small>
</h2>
<hr /> <h2>Demo</h2> <form name="myForm" novalidate>
<label>
Some input:
<input
type="email"
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}} </body>
</html>
var app = angular.module('app', []);

app.controller('MainCtrl', function MainCtrl() {
'use strict'; var vm = this,
_val = '';
vm.angularVersion = angular.version.full;
vm.modelOptions = {
getterSetter: true,
allowInvalid: true
};
vm.inputValue = function(val) {
return angular.isDefined(val) ? (_val = val) : _val;
}
});

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

[AngularJS] Angular 1.3 ng-model-options - getterSetter的更多相关文章

  1. AngularJs学习笔记--Understanding the Model Component

    原版地址:http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model 在angular文档讨论的上下文中,术语“model”可以 ...

  2. Angularjs 学习笔记-2017-02-05-初识Angular及app、model、controller、repeat指令和fileter、orderBy

    ng-app   定义作用域,从作用域处开始执行ng命令指令 ng-model 数据绑定字符,用于双向数据绑定 ng-controller ng控制台,定义function name($scope)来 ...

  3. angularjs中常用的ng指令介绍【转载】

    原文:http://www.cnblogs.com/lvdabao/p/3379659.html 一.模板中可使用的东西及表达式 模板中可以使用的东西包括以下四种: 指令(directive).ng提 ...

  4. [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 ...

  5. [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 ...

  6. AngularJs angular.element

    angular.element 将DOM元素或者HTML字符串一包装成一个jQuery元素. 格式:angular.element(element); element:包装成jquery对象的html ...

  7. AngularJs angular.bind、angular.bootstrap、angular.copy

    angular.bind 返回一个调用self的函数fn(self代表fn里的this).可以给fn提供参数args(*).这个功能也被称为局部操作,以区别功能. 格式:angular.bind(se ...

  8. [Angularjs]angular ng-repeat与js特效加载先后导致的问题

    写在前面 最近在项目中遇到这样的一个前端的bug,在ng-repeat中绑定的图片,有一个晃动的特效,在手机端浏览的时候,图片有时候会正常展示,有时就展示不出来.当时猜测是因为angularjs与特效 ...

  9. AngularJS - Apply方法监听model变化

    <body> <div ng-app="myApp"> <div ng-controller="firstController" ...

随机推荐

  1. 洛谷P1993 小K的农场 [差分约束系统]

    题目传送门 小K的农场 题目描述 小K在MC里面建立很多很多的农场,总共n个,以至于他自己都忘记了每个农场中种植作物的具体数量了,他只记得一些含糊的信息(共m个),以下列三种形式描述: 农场a比农场b ...

  2. Unity 游戏开发技巧集锦之制作一个望远镜与查看器摄像机

    Unity 游戏开发技巧集锦之制作一个望远镜与查看器摄像机 Unity中制作一个望远镜 本节制作的望远镜,在鼠标左键按下时,看到的视图会变大:当不再按下的时候,会慢慢缩小成原来的视图.游戏中时常出现的 ...

  3. openstack多region配置

    实验 A机器 10.64.8.171     RegionOne B机器 10.64.8.142     RegionTwo         Keytson(这个组件随便放在哪台都可以) openst ...

  4. [UOJ61]怎样更有力气

    这个题还是挺有意思的... 一个小结论是:在一个$n$点$m$边的图中,如果度数最小的点度数为$d$,那么$d^2=O(m)$,因为$d\leq\frac{2m}n$,所以$d^2\leq dn\le ...

  5. wampserver -- 解决Exception Exception in module wampmanager.exe at 000F15A0

    Learn from: http://hi.baidu.com/spt_form/item/4b4533476c3b92a6de2a9f78 系统:windows2003 32bit wampserv ...

  6. Jeeplus框架中问题解决

    1,文件上传后图片显示的问题 (1)问题:在这个组件的文档介绍里面写了这个组件是有预览功能的,但是我没有找到,就自己写了这个小功能. 在框架中下图中,这个文件上传组件只能将文件上传,然后将文件名显示出 ...

  7. Educational Codeforces Round 10 A. Gabriel and Caterpillar 模拟

    A. Gabriel and Caterpillar 题目连接: http://www.codeforces.com/contest/652/problem/A Description The 9-t ...

  8. 使用 dsc_extractor 导出 dyld_shared_cache_arm64

    iOS系统的全部Framework二进制被打包成一个cache文件,位于 /System/Library/Caches/com.apple.dyld 目录下,我们要想查看某个系统库的二进制需要将 dy ...

  9. spring boot配置springMVC拦截器

    spring boot通过配置springMVC拦截器 配置拦截器比较简单, spring boot配置拦截器, 重写preHandle方法. 1.配置拦截器: 2重写方法 这样就实现了拦截器. 其中 ...

  10. Linux/UNIX线程(2)

    线程(2) 线程同步 当多个控制线程共享同样内存时,须要确保每一个线程看到一致的数据视图.假设每一个线程使用的变量都是其它线程不会读取或改动的,那么就不在一致性问题. 当两个或多个线程试图在同一时间改 ...