[AngularJS] Angular 1.3 ng-model-options - getterSetter

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

posted @ 2014-11-15 18:23 Zhentiw 阅读(740) 评论(0) 编辑收藏举报

刷新页面返回顶部

（评论功能已被禁用）

公告

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

+加关注

2025年3月

日

一

二

三

四

五

六

Answer1215

[AngularJS] Angular 1.3 ng-model-options - getterSetter

公告

常用链接

最新随笔

积分与排名

随笔分类

随笔档案

阅读排行榜

评论排行榜