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 ...
随机推荐
- 如何生成转储(dmp)文件--工具篇
转储文件也就是我们常说的dump文件.可以把转储文件看成软件的某个时刻的一个快照.转储文件一般都是在软件出现问题时手动生成或者程序自动生成.下面我们介绍几种生成转储文件的方法. 1. 任务管理器 任务 ...
- canvas自适应圆形时钟绘制
前面的话 前面介绍过canvas粒子时钟的绘制,本文将详细介绍canvas自适应圆形时钟绘制 效果演示 最终自适应圆形时钟的效果如下所示 功能分析 下面来分析一下该圆形时钟的功能 [1]静态背景 对于 ...
- jsp中button按钮单击莫名提交两次或刷新页面问题
<button id="btn"></button>目前还不知道原因但是在button标签中加上type="button"属性即可解决问 ...
- matplotlib 出图示例
如果你想要在Linxu中获得一个高效.自动化.高质量的科学画图的解决方案,应该考虑尝试下matplotlib库.Matplotlib是基于python的开源科学测绘包,基于python软件基金会许可证 ...
- 【详细资料】ICN6211:MIPI DSI转RGB芯片简介
ICN6211功能MIPI DSI转RGB,分辨率1920*1200,封装QFN48
- Python学习日志_2017/09/08
今天早晨学习了<Head First :HTML and CSS>:学习了两个章节,感觉从基础学习特别的踏实,能看懂的同时踏踏实实的锻炼了基础的能力.我个人认为无论哪个行业,最重要的永远是 ...
- chrome保持元素hover,active状态
审查元素,选中需要hover的标签 点击"Styles"菜单中的":hov",弹出 Force element state 选中相应的 :hover :acti ...
- NWERC2016-Problem A(Arranging Hat)
Arranging Hat is a cushy job indeed; high impact work, absolute authority, and 364 days of holiday e ...
- IS-IS完整笔记
IS-IS笔记大全 1.公开,ISO国际标准化组织(按照中文顺序翻译) 中间系统到中间系统 双栈.集成 数据传递机制 Cons面向连接网络服务(TCP) Clns缺少链接网络服务(UDP) Is-is ...
- 201521123049 《JAVA程序设计》 第4周学习总结
1. 本周学习总结 1.1 尝试使用思维导图总结有关继承的知识点. 1.2 使用常规方法总结其他上课内容. ###1.类型转换(cast):是将两种不同类型的变量进行转换,但不能随意强制转换,随意强制 ...