<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. CSS三种样式表

    1.外部样式表当样式需要应用于很多页面时,外部样式表将是理想的选择.在使用外部样式表的情况下,你可以通过改变一个文件来改变整个站点的外观.每个页面使用 <link> 标签链接到样式表. & ...

  2. archlinux系统安装博通B43XX系列无线网卡驱动

    我的无线网卡是博通的B43xx系列,大家都知道博通对于其Wifi卡在 GNU/Linux 上的支持不好可谓是臭名昭著. 用 lspci -vnn -d 14e4: 或者 lspci -vnn | gr ...

  3. C4.5算法(摘抄)

    1. C4.5算法简介 C4.5是一系列用在机器学习和数据挖掘的分类问题中的算法.它的目标是监督学习:给定一个数据集,其中的每一个元组都能用一组属性值来描述,每一个元组属于一个互斥的类别中的某一类.C ...

  4. 配置IIS使用Python

    打开IIS管理器 选择功能视图,然后选择ISAPI和CGI限制 打开后,在右侧操作,点击添加,会出现下图所示 按图中提示填写相应部分,在选择路径时,默认可能是dll文件,改成全部文件即可,然后再选择p ...

  5. login shell与non-login shell的区别

    Bash应该是我们每天日常工作接触最多的东西了,就像我们最忠实的朋友,我们有必要了解一下这位朋友的“习性”. Bash有几种不同的运行模式,login shell与non-login shell,in ...

  6. CSS display使用

    .今天我们来分析一下display的一些用法,display样式在我们整个CSS设置中,非常重要,掌握好display,才能有效的解决CSS布局的问题,在理解display之前,我们先了解两个概念:块 ...

  7. vue引入echarts、找不到的图表引入方法、图表中的点击事件

    1.在vue-cli项目中添加webpack配置,本文引入的最新版本.在 3.1.1 版本之前 ECharts 在 npm 上的 package 是非官方维护的,从 3.1.1 开始由官方 EFE 维 ...

  8. Java虚拟机JVM内存分区及代码执行机制

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcyt230 1.  JVM体系结构 图1 JVM体系结构    方法区:存放JVM ...

  9. 探索 ConcurrentHashMap 高并发性的实现机制

    很不错的一篇文章,值得一看 http://www.ibm.com/developerworks/cn/java/java-lo-concurrenthashmap/

  10. C++学习日记(一)————类与对象

     C++远征之封装篇(上)笔记 所有内容都是听课笔记,愿课堂视频如下: C++远征之封装篇(上)-慕课网http://www.imooc.com/learn/382 类和对象 1 什么是类,什么是对象 ...