<select ng-model="model.id" convert-to-number>
<option value="0">Zero</option>
<option value="1">One</option>
<option value="2">Two</option>
</select>
{{ model }}
angular.module('nonStringSelect', [])
.run(function($rootScope) {
$rootScope.model = { id: 2 };
})
.directive('convertToNumber', function() {
return {
require: 'ngModel',
link: function(scope, element, attrs, ngModel) {
//format text from the user (view to model)
ngModel.$parsers.push(function(val) { return parseInt(val, 10); }); 
//format text going to user (model to view)
ngModel.$formatters.push(function(val) { return '' + val; }); } }; });

Formatters Definition

Array of functions to execute, as a pipeline, whenever the model value changes. Each function is called, in turn, passing the value through to the next. Used to format / convert values for display in the control and validation.

Parsers Definition

Array of functions to execute, as a pipeline, whenever the control reads value from the DOM. Each function is called, in turn, passing the value through to the next. Used to sanitize / convert the value as well as validation. For validation, the parsers should update the validity state using $setValidity(), and return undefined for invalid values.

To summarize:

  • Formatters change how model values will appear in the view.
  • Parsers change how view values will be saved in the model.

ng-model值字符串转数值型(convertToNumber directive)的更多相关文章

  1. heap表按字符串和数值型排序规则

    SQL> create user scan identified by scan default tablespace users; User created. SQL> grant db ...

  2. MYSQL中的数值型数据类型与字符串类型

    /* 数值型数据类型主要用来存储数字,包含的类型有: TINYINT.SMALLINT.MEDIUMINT. INT(INTEGER). BIGINT TINGINT占1个字节,SMALLINT占2个 ...

  3. MySQL中的数据类型 [数值型、字符串型、时间日期型]

    MySQL中的数据类型 [数值型.字符串型.时间日期型] MySQL中各数据类型 1. 数值类型(整型) 类型 数据大小 类型 (无符号:unsigned) 数据大小 存储空间 tinyint -12 ...

  4. 字符串类型ip与数值型ip地址相互转换

    /** * 返回Integer类型的ip地址 * @return */ private static Integer ipToInt(){ String ip="192.168.1.201& ...

  5. 怎样验证layer.prompt输入的值为数值型???

    JS中使用isNaN()判断layer.prompt输入的值为数值型,代码如下: layer.prompt({ title: '设置比值', }, function(value, index, ele ...

  6. Docs-.NET-C#-指南-语言参考-关键字-内置类型-值类型:整型数值类型

    ylbtech-Docs-.NET-C#-指南-语言参考-关键字-内置类型-值类型:整型数值类型 1.返回顶部 1. 整型数值类型(C# 参考) 2019/10/22 “整型数值类型”是“简单类型”的 ...

  7. iOS学习之Object-C语言字符串和数值

    一.使用苹果帮助文档      1.帮助文档的作用:帮助开发者快速了解系统类的功能.           1)苹果每次iOS版本的升级,都会添加或者更新大量的API,并提供相应的参考文档.       ...

  8. js中字符串转换为数值的两种方法的区别

    在js中字符串转换为数值的方法有三种:转换函数,强制类型转换,隐式转换 1.转换函数 parseInt()   //将字符串转换为整型 parseFloat()  //将字符串转换为浮点型 转换函数在 ...

  9. mysql概要(二)类型(数值型,字符型,时间类型

    1.mysql数值型范围 tinyint可选属性 tinyint(N) unsigned zerofill N:表示显示长度,与zerofill配合使用,即长度不够用0填充,并且自动变成无符号的数,N ...

随机推荐

  1. vue开发项目的坑

    [Vue warn]: Do not use built-in or reserved HTML elements as component id: MenuItem [Vue warn]: Do n ...

  2. redux源码解读

    react在做大型项目的时候,前端的数据一般会越来越复杂,状态的变化难以跟踪.无法预测,而redux可以很好的结合react使用,保证数据的单向流动,可以很好的管理整个项目的状态,但是具体来说,下面是 ...

  3. python+selenium自动化软件测试(第2章):WebDriver API

    2.1 操作元素基本方法 前言前面已经把环境搭建好了,从这篇开始,正式学习selenium的webdriver框架.我们平常说的 selenium自动化,其实它并不是类似于QTP之类的有GUI界面的可 ...

  4. Docker+Gogs搭建个人Git服务

    欢迎 经常使用Github的我,Github它功能强大,操作简单,不用FQ,所以大家会使用Github进行代码托管,但是,Github的私仓收费的,而且对于普通个人用户来说,价格也不便宜.很多人搭建自 ...

  5. 学习js的点点滴滴记录

    从安装完node.js后(里面自带了npm), 每个模块下都有个 package.json文件,在这个目录下打开cmd后 输入npm install 就是按照package.json里面的内容进行安装 ...

  6. [REST] 1.REST的起源

    0. 世界上第一个网站 1990年12月20日,这一天对于现在的互联网来说意义非凡.欧洲核子研究组织(CREN)的科学家Tim Berners-Lee在一台NeXT电脑上启动了世界上的第一个网站(当然 ...

  7. 极化码的matlab仿真(2)——编码

    第二篇我们来介绍一下极化码的编码. 首先为了方便进行编码,我们需要进行数组的定义 signal = randi([0,1],1,ST); %信息位比特,随机二进制数 frozen = zeros(1, ...

  8. java开发3轮技术面+hr面 面经(MT)

    一直没打理博客园  发现博客园阅读量好大,就把前段时间写的一个面经也搬过来咯,大家一起加油.... 作者:小仇Eleven 链接:https://www.nowcoder.com/discuss/37 ...

  9. CDN架构以及原理分析

    详见: http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp61  在不同地域的用户访问网站的响应速度存在差异,为了提高用户访问的响应 ...

  10. 第4阶段——制作根文件系统之分析init_post()如何启动第1个程序(1)

    本章学习如何启动第一个应用程序 1.在前面的分析中我们了解到,在init进程中内核挂接到根文件系统之后,会开始启动第一个应用程序: kernel_init函数代码如下: static int __in ...