ng-model值字符串转数值型(convertToNumber directive)
<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)的更多相关文章
- heap表按字符串和数值型排序规则
SQL> create user scan identified by scan default tablespace users; User created. SQL> grant db ...
- MYSQL中的数值型数据类型与字符串类型
/* 数值型数据类型主要用来存储数字,包含的类型有: TINYINT.SMALLINT.MEDIUMINT. INT(INTEGER). BIGINT TINGINT占1个字节,SMALLINT占2个 ...
- MySQL中的数据类型 [数值型、字符串型、时间日期型]
MySQL中的数据类型 [数值型.字符串型.时间日期型] MySQL中各数据类型 1. 数值类型(整型) 类型 数据大小 类型 (无符号:unsigned) 数据大小 存储空间 tinyint -12 ...
- 字符串类型ip与数值型ip地址相互转换
/** * 返回Integer类型的ip地址 * @return */ private static Integer ipToInt(){ String ip="192.168.1.201& ...
- 怎样验证layer.prompt输入的值为数值型???
JS中使用isNaN()判断layer.prompt输入的值为数值型,代码如下: layer.prompt({ title: '设置比值', }, function(value, index, ele ...
- Docs-.NET-C#-指南-语言参考-关键字-内置类型-值类型:整型数值类型
ylbtech-Docs-.NET-C#-指南-语言参考-关键字-内置类型-值类型:整型数值类型 1.返回顶部 1. 整型数值类型(C# 参考) 2019/10/22 “整型数值类型”是“简单类型”的 ...
- iOS学习之Object-C语言字符串和数值
一.使用苹果帮助文档 1.帮助文档的作用:帮助开发者快速了解系统类的功能. 1)苹果每次iOS版本的升级,都会添加或者更新大量的API,并提供相应的参考文档. ...
- js中字符串转换为数值的两种方法的区别
在js中字符串转换为数值的方法有三种:转换函数,强制类型转换,隐式转换 1.转换函数 parseInt() //将字符串转换为整型 parseFloat() //将字符串转换为浮点型 转换函数在 ...
- mysql概要(二)类型(数值型,字符型,时间类型
1.mysql数值型范围 tinyint可选属性 tinyint(N) unsigned zerofill N:表示显示长度,与zerofill配合使用,即长度不够用0填充,并且自动变成无符号的数,N ...
随机推荐
- vue开发项目的坑
[Vue warn]: Do not use built-in or reserved HTML elements as component id: MenuItem [Vue warn]: Do n ...
- redux源码解读
react在做大型项目的时候,前端的数据一般会越来越复杂,状态的变化难以跟踪.无法预测,而redux可以很好的结合react使用,保证数据的单向流动,可以很好的管理整个项目的状态,但是具体来说,下面是 ...
- python+selenium自动化软件测试(第2章):WebDriver API
2.1 操作元素基本方法 前言前面已经把环境搭建好了,从这篇开始,正式学习selenium的webdriver框架.我们平常说的 selenium自动化,其实它并不是类似于QTP之类的有GUI界面的可 ...
- Docker+Gogs搭建个人Git服务
欢迎 经常使用Github的我,Github它功能强大,操作简单,不用FQ,所以大家会使用Github进行代码托管,但是,Github的私仓收费的,而且对于普通个人用户来说,价格也不便宜.很多人搭建自 ...
- 学习js的点点滴滴记录
从安装完node.js后(里面自带了npm), 每个模块下都有个 package.json文件,在这个目录下打开cmd后 输入npm install 就是按照package.json里面的内容进行安装 ...
- [REST] 1.REST的起源
0. 世界上第一个网站 1990年12月20日,这一天对于现在的互联网来说意义非凡.欧洲核子研究组织(CREN)的科学家Tim Berners-Lee在一台NeXT电脑上启动了世界上的第一个网站(当然 ...
- 极化码的matlab仿真(2)——编码
第二篇我们来介绍一下极化码的编码. 首先为了方便进行编码,我们需要进行数组的定义 signal = randi([0,1],1,ST); %信息位比特,随机二进制数 frozen = zeros(1, ...
- java开发3轮技术面+hr面 面经(MT)
一直没打理博客园 发现博客园阅读量好大,就把前段时间写的一个面经也搬过来咯,大家一起加油.... 作者:小仇Eleven 链接:https://www.nowcoder.com/discuss/37 ...
- CDN架构以及原理分析
详见: http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp61 在不同地域的用户访问网站的响应速度存在差异,为了提高用户访问的响应 ...
- 第4阶段——制作根文件系统之分析init_post()如何启动第1个程序(1)
本章学习如何启动第一个应用程序 1.在前面的分析中我们了解到,在init进程中内核挂接到根文件系统之后,会开始启动第一个应用程序: kernel_init函数代码如下: static int __in ...