angularJS 报错: [ngModel:numfmt] http://errors.angularjs.org/1.4.1/ngModel/numfmt?p0=333

2023-11-03

<!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指令直接小写得了。。

转载于:https://www.cnblogs.com/yuzhongwusan/p/4645670.html

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

angularJS 报错: [ngModel:numfmt] http://errors.angularjs.org/1.4.1/ngModel/numfmt?p0=333 的相关文章

  • 单值或常量值时在 x 轴上绘制的样条图 - highchart

    while using the older version of highchart 2 1 6 if a plot had only one value or a series of same values it would plot a
  • 将 Javascript 变量转换为 PHP 变量

    我想使用由 videoel getCurrentTime 函数返回给我的 javascript 变量 并将其转换为 php 变量 以便我能够将其添加到我的 SQL 插入查询中 例如 INSERT INTO tblData VALUES ph
  • 使用闭包和自调用函数制作计数器

    我想知道为什么这段代码不起作用 var uniqueInteger function var counter 0 return function return counter console log uniqueInteger 0 cons
  • 通知用户消息仍在输入中

    我正在使用 Laravel 5 6 7 Socket IO 和 vue js 我没有使用 Pusher 和 redis 下面是我的代码 用于向与我一对一聊天的用户发送消息 var url http localhost 6001 apps M
  • 来自 DataURL 的 Blob?

    Using FileReader s readAsDataURL 我可以将任意数据转换为数据 URL 有没有办法将数据 URL 转换回Blob使用内置浏览器 API 的实例 用户 Matt 一年前提出了以下代码 如何在javascript中
  • 使用 NodeJS 让 Discord 机器人发送带有消息的图片

    我有几张照片 全部在 imgur 上 带有直接图像链接 格式 https i imgur com XXXXXX jpg https i imgur com XXXXXX jpg 以及用 NodeJS 制作的 Discord 机器人 我发送这
  • 如何在 Node.js 中让一个 EventEmitter 监听另一个 EventEmitter?

    我想做这样的事情 var events require events var emitterA new events EventEmitter var emitterB new events EventEmitter emitterA ad
  • JavaScript 变量赋值与 OR 对比 if 检查[重复]

    这个问题在这里已经有答案了 在 JavaScript 中 我最近意识到你可以使用 OR 赋值的逻辑运算符 我想知道这是否被认为是不好的做法 特别是 我有一些具有可选数组输入的函数 如果输入是null or undefined我应该将它设置为
  • Chrome SuppressDifferentOriginSubframeJSDialogs 使用 JS 设置覆盖?

    Chrome 开发团队显然刚刚推出了一项名为 SuppressDifferentOriginSubframeJSDialogs 的新 功能 这使得默认情况下不会显示来自与父级不同域上的 iFrame 的警报 确认框 https www ch
  • 是否可以将反应组件导出为非反应项目中的函数

    有没有办法在非 React 项目中将 React 组件导出为函数并传入 props 作为函数的参数 我最近用 create react app 完成了一个 React 项目 现在我想将它用于其他非 React 项目 纯 Javascript
  • 为什么将数据存储为元素的属性存在风险?

    我一直在读同样的东西 直接在 DOM 元素上存储属性值是有风险的 因为可能会发生内存泄漏 但有人可以更详细地解释这些风险吗 按属性 我假设您指的是 DOM 元素上的属性 DOM 元素上的自定义属性安全吗
  • 从未定义解构时避免错误

    可以说我有这个代码 const x y point Babel 会将其变成 var point point x point x y point y 这很好 但是如果点未定义怎么办 现在我得到一个错误 Cannot read property
  • Bing.com 如何创建放大的缩略图?

    当我使用 Bing com 搜索图像时 我发现它们的图像经过精心裁剪和排序 当您将鼠标放在图像上时 会弹出另一个窗口 其中显示放大的图像 我想在我的程序中做同样的事情 我检查了他们页面的源代码 他们正在使用 javascript 但我仍然不
  • 使用 Javascript / Jquery 的本地存储(不使用 HTML5)

    我想在 javascript 或 jquery 中复制本地存储概念 类似于 HTML5 但不幸的是我不知道如何开始 任何人都可以建议如何使用 javascript 或 jquery 实现本地存储 不使用 HTML5 这是一个有点愚蠢的差事
  • 使用 jQuery 仅从字符串末尾修剪空格

    我知道 jQuery trim 函数 但我需要的是一种仅从字符串末尾修剪空格的方法 而不是开头 So str this is a string 会成为 str this is a string 有什么建议么 Thanks 您可以使用正则表达
  • 点击问题:动态生成的链接不触发点击功能

    下面是两个代码片段 由于某种原因什么也没有发生 但来自同一个 JS 文件的其他 jQuery 函数在带有 UL 的页面上执行得很好 这是在盯着我看吗 ul class paganation li 1 li li a href 2 a li
  • 在 vue.js 模板中包含外部脚本

    我是 Vue js 和 web pack 的新手 所以我决定使用 vue cli webpack 来构建初始应用程序 我试图包含一个外部脚本 例如组件 不需要的模板中 但是 Vue 警告这是不允许的 我的 index html 文件与最初生
  • Meteor.js 登录事件

    因此 我对 Meteor 框架和 JavaScript 总体来说还很陌生 但我正在使用该框架开发一个小项目 以尝试让自己达到标准 基本上我正在开发一个微博客网站 目前 用户可以通过多种服务登录 fb google 等 我通过插入所需 url
  • 使用Promise而不拒绝它会导致内存泄漏吗? [复制]

    这个问题在这里已经有答案了 代码如下 function test value return new Promise function fulfill reject try fulfill true catch e throw e 我担心的是
  • 在声明组件选择器时添加指令 - Angular 7

    我正在学习 Angular 并通过单击按钮动态创建组件 我正在尝试使用 Angular Material 的拖放功能来拖动这些创建的组件以对它们进行排序 我的基本组件 html 中有以下代码 div style margin 20px di

随机推荐

  • java评论功能怎么实现_评论功能的简单实现

    最近在写一个问答功能 类似于评论 几番找资料才有点感觉 主要是太菜了 为了加深印象就单独抽出来记下笔记 然后这篇写完就开始SpringBoot的复习了 1 说明 网上看到有三种类型的评论 按照笔者的理解记下了过程 可能理解错了 望大神指出
  • 哈希算法题(砝码&数量得到种数)

    现有n种砝码 重量互不相等 分别为 m1 m2 m3 mn 每种砝码对应的数量为 x1 x2 x3 xn 现在要用这些砝码去称物体的重量 放在同一侧 问能称出多少种不同的重量 注 称重重量包括 0 include
  • MySQL【DQL查询数据(最重点)】

    DQL查询数据 最重点 4 1 DQL Data Query LANGUAGE 数据查询语言 所有的查询操作都用它 Select 简单的查询 复杂的查询它都能做 数据库中最核心的语言 最重要的语句 使用频率最高的语句 4 2 指定查询字段
  • HTML、CSS、JavaScript:网页开发的三大利器

    JavaScript 让网页更加生动有趣 JavaScript是一种广泛应用于网页开发的编程语言 它可以让网页更加生动有趣 在本文中 我们将介绍JavaScript的基本概念和应用 帮助读者更好地了解这个强大的编程语言 JavaScript
  • 一文读懂高速互联的阻抗及反射(中)

    一文读懂高速互联的阻抗及反射 中 勘误 上篇中 电感的电抗叫做感抗 表示为 X L j C
  • 2017网易游戏测试工程师-实习招聘在线笔试题

    网易游戏测试工程师 一 A游戏又要开新服了 为了在短时间内冲排名 你得尽可能多地完成游戏任务 通过事先查攻略我们知道了所有的游戏任务 以及每个任务的时间窗口 一旦选定了做某个任务 在所选定任务的整个持续时间内只能做这个任务 且只能等到当前任
  • SpringBoot整合多数据源Redis

    SpringBoot整合Redis 其实方法跟单数据差不多的 这里给大家写一下 文章目录 SpringBoot整合Redis 多数据源整合 多数据源整合 一 完成配置文件 Spring配置 spring 资源信息 messages 国际化资
  • python atexit模块的使用

    python atexit模块的使用 模块的简介 atexit模块主要的作用就是在程序即将结束之前执行的代码 atexit模块使用register函数用于注册程序退出时的回调函数 然后在回调函数中做一些资源清理的操作 该模块其实是一个对 s
  • 寻找峰值

    LeetCode 寻找峰值 峰值元素是指其值大于左右相邻值的元素 给定一个输入数组 nums 其中 nums i nums i 1 找到峰值元素并返回其索引 数组可能包含多个峰值 在这种情况下 返回任何一个峰值所在位置即可 你可以假设 nu
  • Eclipse、AndroidStudio

    Eclipse ADT SDK AndroidStudio Android Plugin for Gradle gradle SDK
  • 【自然语言处理】最大熵马尔可夫模型

    有任何的书写错误 排版错误 概念错误等 希望大家包含指正 由于这部分的参考资料比较少 网上大部分资料重复且不完整 对于一些关键计算没有推导 所以这里我主要讨论几篇论文和讲义 但是这些论文和讲义之间也有些许差别 讨论的过程中我会加入自己的理解
  • 百度网盘下载提速,推荐3种亲测有效的方法

    凉透的下载工具 自从PanDownload事件之后 陆续出了很多第三方的度盘不限速下载神器 但是最后都凉了 这些第三方下载神器 都是个人开发者 即便有盈利也承受不起巨大的风险 甚至有款下载神器 用爱发电 流程是这样的 1 用户提交下载链接
  • 34门课改变人生——牛人自学计算机总结

    转载说明 在人人网上看到一个在美国学生物的硕士通过MOOC学习最终找到IT工程师工作的故事 非常励志 而且每门课都有很有价值的点评 经过作者本人同意转载到MOOC学院 如果各位有后续问题可以把他本人拉来答疑 转载正文 首先这只是我个人的总结
  • Java小细节

    一 result null 和 result isEmpty 有什么区别 在 Java 中 result null 和 result isEmpty 是两个不同的检查 分别用于不同的目的 result null 这个检查用于确定变量 res
  • 最大平均值子数组

    最大平均值子数组
  • 企业级springboot项目架构模板V3.0,开箱即用

    此次 3 0 更新点 1 加入文件服务 quick storage 功能支持OSS FTP存储 该服务支持以SDK的方式引入 2 修复sentinel因path路径问题导致流控失效问题 3 修复word模板生成PDF文件工具类时首次生成时
  • 电子科技大学编译原理复习笔记(五):词法分析

    目录 前言 重点一览 词法分析概述 词法分析的功能 词法分析器的输出形式 词法分析器的结构 状态转换图 状态转换图的构造 词法分析器的设计 基本结构 内容 符号表 目的 组成 在词法分析中的作用 符号表的一般形式 常用的符号表结构 总结与补
  • 现有一个01串s,找出一个最长的连续子串。

    描述 如果一个01串任意两个相邻位置的字符都是不一样的我们就叫这个01串为交错01串 例如 1 10101 0101010 都是交错01串 现有一个01串s 找出一个最长的连续子串 并且这个字串是一个交错01串 求出最长的这样的子串的长度是
  • 华为CE6865交换机远程抓包

    一 背景 由于数据中心使用了VXLAN技术 导致在三层网络中查看不到原始的MAC数据帧 另外一个局限就是所有网络设备都不在本地 所以无法使用镜像技术进行抓包 最后决定使用交换机自带的抓包工具进行远程抓包 把抓包后的文件先保存在交换机上 然后
  • angularJS 报错: [ngModel:numfmt] http://errors.angularjs.org/1.4.1/ngModel/numfmt?p0=333

    pre stringToNumber2 指令中这么写没问题 但是html中调用也这么写 html解析会自动将标签和标签属性专为小写 即stringToNumber2变成了stringtonumber2 导致最终 Error ngModel