角度指令忽略非数字输入

2024-05-13

我必须为 IE8 编写一些代码。我有一个 ng-repeat 创建一个表,其中包含:

<input production-qty type="text" class="input-mini" maxlength="3" ng-model="day.qtyA" ui-event="{ blur : 'updateProduction(day)' }" ng-disabled="day.type=='H'">

IE8 不会执行 type=number

我想要一个指令,该指令将忽略该输入字段上非数字键的击键....即....0 - 9

我不想让用户输入 abc 并污染模型,然后告诉他们该值无效。我不想让他们输入任何原本无效的数据。


HTML:

<input production-qty type="text" maxlength="3" ng-model="qty1">

指示:

app.directive('productionQty', function() {
  return {
    require: 'ngModel',
    link: function (scope, element, attr, ngModelCtrl) {
      function fromUser(text) {
        var transformedInput = text.replace(/[^0-9]/g, '');
        console.log(transformedInput);
        if(transformedInput !== text) {
            ngModelCtrl.$setViewValue(transformedInput);
            ngModelCtrl.$render();
        }
        return transformedInput;  // or return Number(transformedInput)
      }
      ngModelCtrl.$parsers.push(fromUser);
    }
  }; 
});

Plunker http://plnkr.co/edit/cXew2Ln3rOuSon23Mmuk?p=preview

也可以看看对输入中的 ng-model 进行过滤 https://stackoverflow.com/questions/14419651/angularjs-filters-on-ng-model-in-an-input。我上面的答案是根据 pkozlowski.opensource 的答案建模的。

我查看了 ng-pattern,但它没有过滤文本框中显示的内容。它设置$scope.qty1 to undefined,但不需要的字符在文本框中可见。

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

角度指令忽略非数字输入 的相关文章

  • getFieldValue 或 Formik 中的类似内容

    有没有办法获取 formik 中单击处理程序内字段的值 您可以使用setFieldValue在那里 所以我假设 但在任何地方都找不到 Formik 应该有类似的东西来检索值
  • 将字符串转换为整数数组

    我想转换以下字符串 14 2 到一个由两个整数组成的数组中 我该怎么做 现代浏览器的快速浏览器 14 2 split map Number 14 2
  • 尝试为每一行编写测试用例

    已经编写了跳跃方法的测试用例 但当我看到代码覆盖率报告时 它不会进入onloadend方法seat onloadend 在 createSpyObj 中我调用了 loadend 但它仍然没有进入内部 你们能告诉我如何解决它吗 下面提供我的代
  • 如何禁用WebStorms未使用的功能颜色功能?

    我想知道是否有人知道如何禁用 WebStorm 中的功能 如果您创建一个函数但尚未调用它 颜色将保持绿色而不是灰色 我进入首选项区域并将全局函数颜色更改为绿色 但只有当我调用它们时它们才会变成绿色 对于任何未调用的函数将保持灰色 转到文件
  • 创建链接到 csv 文件的表

    我正在尝试创建一个链接到的表 csv使用 d3 文件 但我得到的只是一个空白网页 即使以克里米亚为例 我也得到一张空白页 我将很高兴得到指导或展示一个可行的例子或关于我做错了什么的建议 如果您询问如何从 CSV 数据创建 HTML 表 这就
  • Razorpay 支付集成 -> 我如何检测关闭按钮 X 附近的 razorpay 模型

    我在 CI 框架中使用 Razorpay 当用户在没有付款的情况下关闭时 创建 razor 支付模型 然后对于取消订单 我希望通过状态更改为已取消来触发查询 那么我怎样才能检测到这一点 我已经在使用 by click jQuery 点击关闭
  • 使用 Javascript 在前端创建基本 URL(开发、API 和生产)

    无论开发和部署如何 如何制作适用于 http https localhost 端口和实际域的基本 url 我想创建一个可以在所有场景或条件下工作的基本 url 无论 http https 协议 端口 本地主机和实际域如何 无论是在开发中还是
  • 异步加载 Angular 指令模板

    我希望能够从加载指令的模板promise e g template templateRepo get myTemplate templateRepo get返回一个承诺 当解析时 模板的内容将包含在字符串中 有任何想法吗 您可以在指令中加载
  • 使用 javascript 在 IFrame 中打印 PDF 文件仅获取一页

    这是我打印 pdf 文件的代码 在这里 在打印时我只得到一页 我需要一个解决方案 function printPdf var ifr document getElementById frame1 PDF is completely load
  • 正则表达式匹配除括号中的单词之外的所有单词 - javascript

    我使用以下正则表达式来匹配所有单词 mystr replace W s g function match p1 index title 请注意 单词可以包含特殊字符 例如德语变音符号 如何匹配除括号内的单词之外的所有单词 如果我有以下字符串
  • 量角器检查元素是否不存在

    我在基于角度的网站中有一个设置可以打开和关闭下拉菜单 如果关闭 则不会显示在主页上 对于量角器 我需要检查开关关闭时该元素是否不存在 但是 我不应该陷入 未找到元素 错误 因为它是一组许多测试中的一个 我该怎么做 我曾尝试这样做 expec
  • 对数组进行分组并获取计数[重复]

    这个问题在这里已经有答案了 假设我有这样的数组 foo bar foo bar bar bar zoom 我想将其分组 这样我就可以得到这样的计数 foo 2 bar 4 zoom 1 有没有一个实用程序可以做到这一点 只需使用该功能Arr
  • Vim、Javascript、DoctorJS (jsctags) 和 Taglist(源代码浏览)

    我已经安装了DoctorJS http doctorjs org 之前jsctags 试图为 Vim 获得一些好的源代码浏览 标签列表 使用Taglist http www vim org scripts script php script
  • 将 SVG 下载为 PNG 图像

    我想将 HTML 页面中的 SVG 元素下载为 PNG 格式 我尝试了此操作 但下载了一个空白的 PNG 图像 如何将我的 HTML SVG 下载为 PNG 我用过这个https bl ocks org biovisualize 81878
  • 垂直滚动,与 div/元素/锚点对齐/对齐

    我发现了一些可爱的网站 http www mini jp event campaign big point http www mini jp event campaign big point http www twenty8twelve c
  • HTTPS 网站上的 ShareThis 按钮不可点击

    我已将 共享此 按钮添加到我的安全站点 现在单击它们时会产生错误 下面提到了错误 以前有人遇到过这个问题吗 阻止加载混合活动内容 http w sharethis com button buttons js http w sharethis
  • 使用 JavaScript 和 HTML 打印表情符号

    为什么这有效 p x1f604 p 而这并没有 document getElementById emoji innerHTML String fromCharCode parseInt 1f604 16 JS 术语中的 char 实际上是一
  • React 不适用于 Android 4.4.2 Web 视图浏览器

    React 在我的 Android 手机上不起作用 我不认为这是我的代码错误 因为即使我写的唯一内容是 p hello world p 它仍然没有显示 在 chrome 远程吊顶上查看后 这显示了 Map is not defined 以前
  • 是否可以使用 fs.createWriteStream 在文件中间写入文本? (或者一般在 Node.js 中)

    我正在尝试写入文本文件 但不是像appendFile 那样在最后写入或通过替换整个内容 我看到可以选择从 fs createwritestream 的启动参数开始的位置 gt https nodejs org api fs html fs
  • AES 在 cryptojs 中加密并在 python Crypto.Cipher 中解密

    使用 js CryptoJS 加密并使用 python crypto Cipher 解密时出现问题 这是我在js中的实现 附加 iv 与加密消息并使用 base64 进行编码

随机推荐

  • RecyclerView 不调用 onCreateViewHolder 或 onBindView

    没有收到任何错误 所有数据似乎都有效 由于某种原因 没有调用与视图相关的方法 我已确定以下事项 getItemCount 是唯一被调用的适配器方法 并且返回一个正整数值 我知道这将是你们将要查看的区域 构造函数正在被调用 成员变量有效 Pa
  • 设置 Silex Bootstrap 时出现 Apache 错误:无法检查 htaccess 文件

    我正在尝试使用 Silex Bootstrap 建立一个网站 我已将它与其他 Web 项目一起放在我的文件夹中 并更改了 Apache 配置中的 DocumentRoot
  • 将 scanf 与 NSString 一起使用

    我希望用户输入一个字符串 然后将输入分配给 NSString 现在我的代码如下所示 NSString word scanf s word The scanf http www cplusplus com reference clibrary
  • 如何在 Xcode 10 中恢复快速帮助?

    在我升级到 Xcode 10 后 快速帮助信息仅提供所选类或结构的声明 是否有某个设置可以使其与 Xcode 9 中的设置相同 升级后我遇到了同样的问题 其中函数签名是单击选项时唯一显示的内容 当我删除里面的所有内容后 快速帮助再次出现 L
  • Docker-compose:npm 安装成功后卷中不存在 node_modules

    我有一个具有以下服务的应用程序 web 在端口 5000 上保存并运行 python 3 Flask Web 服务器 使用 sqlite3 worker 有一个index js文件是队列的工作人员 Web 服务器通过端口使用 json AP
  • 将 Python 3 与 AWS lambda 结合使用

    可以在 lambda 中使用使用 Python3 构建的应用程序 而不仅仅是 python2 7 可能会考虑周围的选择 https gun io blog announcing zappa serverless python aws lam
  • 我可以以某种方式“编译”一个Python脚本以在没有安装Python的PC上运行吗?

    所以我有一个Python脚本 myscript py 我是这样执行的 python D myscript py 但是 我必须安装 Python 并将其包含在PATH使其工作的环境变量 是否有可能以某种方式将 Python 可执行文件与 Py
  • 如何向 SvelteKit/Vite 应用添加版本号?

    我正在尝试在我的 SvelteKit 应用程序中创建一个系统 它会在某个页面上向您显示有关当前应用程序版本的信息 最好是 Git 提交哈希和描述 我尝试使用Vite的定义功能 https vitejs dev config define在构
  • Android On Focus Listener 和 On Click Listener on ImageView

    我有一个 imageview 它具有两个属性 可聚焦的 and 可聚焦触摸模式 set to true
  • 如何解释 mgcv 的随机效应图

    我有一些关于在 GAM 中使用随机效果的问题 首先 您如何解释和传达输出图 我在这个 GAM 中将火灾建模为随机效应 因为它在我的不同现场站点上很大程度上是随机发生的 并且我只将其记录为二进制 它不能作为普通变量工作 因为它的级别太少 而且
  • Cakephp - CSRF 令牌不匹配

    我在 Cakephp 3 6 中有一个项目 其中 MessageController 中的 3 个操作由 Ajax 调用 但是 我有一个问题 当我向其中一个操作发送请求时 XHR 会向我返回以下内容 message CSRF token m
  • 带有 .htaccess 的漂亮网址?

    我刚刚创建了一个新的 WordPress 页面模板 在其中运行一些 php mysql 脚本 我想对其子页面应用 mod 重写 例如我生成了以下链接 http www quotist com quotes by authors html l
  • 首选项和操作栏中的开/关切换按钮 - 冰淇淋三明治风格

    我指的是 ICS 手机上默认 Android 设置应用程序中看到的蓝色开 关样式 也可以在这里看到 http android developers blogspot com 2012 02 android design v2 now wit
  • java中的回调是什么[重复]

    这个问题在这里已经有答案了 可能的重复 什么是回调函数 https stackoverflow com questions 824234 what is a callback function 我已经阅读了回调的维基百科定义 但我仍然没有明
  • 如何将十六进制字符串转换为十进制值

    我尝试将十六进制字符串转换为十进制值 但它没有给我预期的结果 I tried convert toint32 hexa 16 convert todecimal hexa 我有一个看起来像这样的字符串 1 12 94 201 198 我把它
  • 按下按钮即可持续移动

    我按照在线教程制作了一个贪吃蛇游戏 并需要一些帮助来进行一些更改 截至目前 holding向左或向右箭头键将使蛇移动 它能让蛇向左或向右移动吗只需轻按一下按钮所以用户不必按住箭头键 question True while not gameE
  • 获取 Promise 的值并分配给变量

    utility fetchInfo 返回一个 Promise 对象 我需要能够获取此 Promise 对象的值 并将其值分配给一个变量 以便稍后在我的代码中使用 此刻 我可以愉快地打印出result到控制台 但我需要能够将此值分配给myVa
  • 重载逻辑运算符 && 和 ||从 C++17 开始短路?

    我读到http en cppreference com w cpp language operators http en cppreference com w cpp language operators 布尔逻辑运算符 运算符 和运算符
  • 如何将存储过程中的值返回到 EF

    我试图通过 EF 调用存储过程并从存储过程中检索返回值 我用过this https stackoverflow com questions 6861737 executesqlcommand with output parameter an
  • 角度指令忽略非数字输入

    我必须为 IE8 编写一些代码 我有一个 ng repeat 创建一个表 其中包含