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. 单纯用JS做的分页插件

    最近公司需要用到分页插件,由于市面上大多都是jQuery的分页插件,而且项目中有自己的工具类,所以说我在工具类中又添加了不依赖jQuery的分页插件,而且分页插件来说对DOM的操作也不是很多,就是用J ...

  2. Building Robust and Flexible Event System in Unity3D

    Building Robust and Flexible Event System in Unity3D 1. Prerequisites 1.1 Observer Pattern According ...

  3. BZOJ4530 BJOI 2014 大融合

    对LCT子树大小进行维护. size表示实子树大小,sz表示虚子树大小. 具体操作是体现在link和splay中,可以看代码. 注意每次做完都要update. By:大奕哥 #include<b ...

  4. luoguP1354房间最短路问题

    判断两点间连通性,建图跑floyed #include<bits/stdc++.h> using namespace std; ; struct node { ],x; }q[N];dou ...

  5. 如何解决IIS7上传文件大小限制，.NET 上传文件后 找不到目录解决

    IIS7 默认文件上传大小是30M,那么超过30M的文件就无法上传了,那么就需要对IIS的配置文件进行修改. 在实际应用中往往会出现上传文件太大,无法上传的情况,那是因为IIS对上传文件大小有限制,I ...

  6. ruby 状态转移

    0. 引言       昨天遇到一个问题,就是关于对象状态转移的问题,我姑且这样命名吧.简要描述一下就是:对于一个人,他有进食,帮助他人,恋爱等功能,但是这些功能是有先后顺序的,对于刚出生的人,他要先 ...

  7. HDU 4666 Hyperspace （2013多校7 1001题 最远曼哈顿距离）

    Hyperspace Time Limit: 20000/10000 MS (Java/Others)    Memory Limit: 65535/65535 K (Java/Others)Tota ...

  8. OpenCV2马拉松第12圈——直方图比較

    收入囊中 使用4种不同的方法进行直方图比較 葵花宝典 要比較两个直方图, 首先必需要选择一个衡量直方图相似度的对照标准.也就是先说明要在哪个方面做对照. 我们能够想出非常多办法,OpenCV採用了下面 ...

  9. Marvell w8782 sdio wifi AP模式设置

    http://blog.csdn.net/junllee/article/details/8895908 w8782工作在station模式一切正常,于是想试试AP模式(master mode): A ...

  10. ELM322 - OBD (VPW) to RS232 Interpreter (v2.0)

    http://elmelectronics.com/DSheets/ELM322DS.pdf