angularJS 报错： [ngModel:numfmt] http://errors.angularjs.org/1.4.1/ngModel/numfmt?p0=333
<!doctype html>
<html ng-app="a10086">
<head>
<meta charset="utf-8">
<script src="angular.min.js"></script>
</head>
<body> <pre>
stringToNumber2 指令中这么写没问题，
但是html中调用也这么写,html解析会自动将标签和标签属性专为小写，即stringToNumber2变成了stringtonumber2，
导致最终：Error: ngModel:numfmt Model is not of type `number`。。产生的原因：不是你指令内写错了，而是指令(驼峰书写)与html中调用的指令名称(小写)不相同
若html中调用指令改成：string-to-number2就可以了。。ng好变态。
</pre>
<div ng-controller="kkc">
<input type="date"/>
正确的<input type="number" string-to-number ng-model="cc.a"/> {{ cc.a }}
错误的：<input type="number" stringToNumber2 ng-model="cc.b"/> {{ cc.b }} </div> </body>
</html>
<script> angular.module('a10086',[])
.controller('kkc',function($scope){
$scope.cc={
a:'222',b:'333'
}//虽然这里后台给出的a和b是字符串，但是指令会专为数字。
}).directive('stringToNumber', function() {
return {
require: 'ngModel',
link: function(scope, element, attrs, ngModel) {
ngModel.$parsers.push(function(value) {
return '' + value;
});
ngModel.$formatters.push(function(value) {
return parseInt(value);
});
}
};
}).directive('stringToNumber2', function() {
return {
require: 'ngModel',
link: function(scope, element, attrs, ngModel) {
ngModel.$parsers.push(function(value) {
return '' + value;
});
ngModel.$formatters.push(function(value) {
return parseInt(value);
});
}
};
});
</script>
AngularJS v1.4.1
input type="number"：原因是在ipad上需要调用数字键盘，所以需要用这个，若type="text"则是不会报错了；根据提示信息将数据
$scope.cc={
a:'222',b:'333'
}改成cc.a=222,cc.b=333方可不报错，但因为该数据是从后台过来的，所以需要进行处理，故使用指令解决。。
但是依然报错，后来找到原因是指令大小写的问题：stringToNumber2，而html中写为stringToNumber2，看似一样其实不一样，因为浏览器在解析页面标签属性时会将其变成小写stringtonumber2，故“333”就没有解析成功，看指令：stringToNumber，在html中调用指令使用2中方式：1为string-to-number，2指令直接小写得了。。
angularJS 报错： [ngModel:numfmt] http://errors.angularjs.org/1.4.1/ngModel/numfmt?p0=333的更多相关文章
- AngularJs 报错 Error: [$parse:lexerr]
参考:https://www.cnblogs.com/fangshidaima/p/6048071.html 错误: 根据错误找到报错行: $scope.$apply($scope.param1 = ...
- applicationContext.xml 文件头报错Referenced file contains errors
问题如下:原先运行正常的项目,突然在applicationContext.xml 文件头报错 内容:Referenced file contains errors (http://www.spring ...
- Eclipse 中 Spring 项目的 XML 配置文件报错 Referenced file contains errors
原来运行正常的项目,突然在applicationContext.xml 文件头报错 总结一下网上的解决方案: 1.有可能网络状况不好导致 如果使用Maven构建项目,spring在加载xsd文件时总是 ...
- 安卓 android studio 报错 Lint found fatal errors while assembling a release target
报错截图如下: 解决方法:在app的build.gradle中添加如下代码 android{ lintOptions { checkReleaseBuilds false abortOnError f ...
- AngularJS报错：[$compile:tpload]
页面中有: <div ng-view></div> 这里会根据不同的路由设置选择不同模版下的内容. 如果把AngularJS网站项目放在包含中文字的目录中,会报以上的错. 解决 ...
- angularJS报错$apply already in progress的原因和解决方法
如果我们使用了AngularJS中的$scope.$apply()或者$scope.$digest(),我们很可能会遇到类似下面的错误,虽然这个错误没有太大影响,但是在日志中看起来还是很不爽的,日志中 ...
- AngularJS报错：[$injector:unpr] Unknown provider: $templateRequestProvider
在页面中由上到下引用了: angular.js angular-route.js 创建model的时候也写明了依赖: var someApp = angular.module('someApp',[' ...
- angularjs报错问题记录
1.[$injector:unpr]:没有找到注入的东西 2.$compile:multidir:多指令编译错误. 3.[ng:areq]:重复定义了ng-controller. 4 ...
- nodejs在spawn中执行npm报错 [Error: spawn ENOENT]” errors
描述: 上代码 var ps = require('child_process').spawn("npm", ['install'], { stdio: 'inherit', cw ...
随机推荐
- PythonDay02
>三目运算符 简单的if---else---语句 result = 1234 if 1 > 2 else 4321 print(result) >集合 set集合,是一个无序且不重复 ...
- 委托（delegate）的三种调用方式：同步调用，异步调用，异步回调（转载）
下面为即将被调用的方法: public delegate int AddHandler(int a,int b); public class 加法类 { public static int Add(i ...
- Web前端开发规范文档
Web前端开发规范文档 规范目的: 使开发流程更加规范化. 通用规范: TAB键用两个空格代替(windos下tab键占四个空格,linux下TAB键占八个空格). CSS样式属性或者JAVASCRI ...
- DuiLib学习笔记1——编译运行demo
c++中皮肤问题比较麻烦,MFC自带的太难用.DirectUI界面库就比较强大了,之前像skin++之类的基于DirectUI收费昂贵.DuiLib是基于DirectUI的界面库,可以将用户界面和处理 ...
- EBS R12.2应用层启动脚本的执行过程
$ pwd /app/oracle/apps/VIS/fs1/inst/apps/VIS_erptest/admin/scripts $ ./adstrtal.sh apps/apps You are ...
- leetcode 257
查找二叉树中根节点到叶子节点的所有路径: 本题有两种解法:递归解法和非递归解法,递归解法请参考:http://blog.csdn.net/booirror/article/details/477331 ...
- [原创]java WEB学习笔记100：Spring学习---Spring Bean配置：SpEL详细介绍及代码演示
本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...
- Web 通信 之 长连接、长轮询(转)
Web 通信 之 长连接.长轮询(long polling) 基于HTTP的长连接,是一种通过长轮询方式实现"服务器推"的技术,它弥补了HTTP简单的请求应答模式的不足,极大地增强 ...
- CPU cache
cache是一种小而快的缓冲器,用在CPU和main memory之间进行数据读写. 在processor访问主memory时,首先检查cache中是不是有一份copy,如果cache hit,则直接 ...
- Windows消息传递机制详解
Windows是一个消息(Message)驱动系统.Windows的消息提供了应用程序之间.应用程序与Windows系统之间进行通信的手段.应用程序想要实现的功能由消息来触发,并且靠对消息的响应和处理 ...