<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. 如何生成转储(dmp)文件--工具篇

    转储文件也就是我们常说的dump文件.可以把转储文件看成软件的某个时刻的一个快照.转储文件一般都是在软件出现问题时手动生成或者程序自动生成.下面我们介绍几种生成转储文件的方法. 1. 任务管理器 任务 ...

  2. canvas自适应圆形时钟绘制

    前面的话 前面介绍过canvas粒子时钟的绘制,本文将详细介绍canvas自适应圆形时钟绘制 效果演示 最终自适应圆形时钟的效果如下所示 功能分析 下面来分析一下该圆形时钟的功能 [1]静态背景 对于 ...

  3. jsp中button按钮单击莫名提交两次或刷新页面问题

    <button id="btn"></button>目前还不知道原因但是在button标签中加上type="button"属性即可解决问 ...

  4. matplotlib 出图示例

    如果你想要在Linxu中获得一个高效.自动化.高质量的科学画图的解决方案,应该考虑尝试下matplotlib库.Matplotlib是基于python的开源科学测绘包,基于python软件基金会许可证 ...

  5. 【详细资料】ICN6211:MIPI DSI转RGB芯片简介

    ICN6211功能MIPI DSI转RGB,分辨率1920*1200,封装QFN48

  6. Python学习日志_2017/09/08

    今天早晨学习了<Head First :HTML and CSS>:学习了两个章节,感觉从基础学习特别的踏实,能看懂的同时踏踏实实的锻炼了基础的能力.我个人认为无论哪个行业,最重要的永远是 ...

  7. chrome保持元素hover,active状态

    审查元素,选中需要hover的标签 点击"Styles"菜单中的":hov",弹出 Force element state 选中相应的 :hover :acti ...

  8. NWERC2016-Problem A(Arranging Hat)

    Arranging Hat is a cushy job indeed; high impact work, absolute authority, and 364 days of holiday e ...

  9. IS-IS完整笔记

    IS-IS笔记大全 1.公开,ISO国际标准化组织(按照中文顺序翻译) 中间系统到中间系统 双栈.集成 数据传递机制 Cons面向连接网络服务(TCP) Clns缺少链接网络服务(UDP) Is-is ...

  10. 201521123049 《JAVA程序设计》 第4周学习总结

    1. 本周学习总结 1.1 尝试使用思维导图总结有关继承的知识点. 1.2 使用常规方法总结其他上课内容. ###1.类型转换(cast):是将两种不同类型的变量进行转换,但不能随意强制转换,随意强制 ...