javascript - Angular 驱动形式如何禁用在数字输入处写入十进制数字的选项

Question

我在 Angular 中有一个表单，我希望用户只提交一个完整的数字(不是小数)，并且他不能选择在表单中写入 .(点)符号来写入十进制数。我想完全阻止在表单中写入 .(dot) 的选项。可能吗？

我在这里尝试了解决方案: Proper way to restrict text input values (e.g. only numbers)使用正则表达式:

在component.ts中添加此函数

_keyUp(event: any) {
    const pattern = /[0-9\+\-\ ]/;
    let inputChar = String.fromCharCode(event.charCode);

    if (!pattern.test(inputChar)) {
      // invalid character, prevent input
      event.preventDefault();
    }
}

在您的模板中使用以下内容

<input(keyup)="_keyUp($event)">

但它不起作用，在表单中写入 .(点)的选项仍然可以。

我想完全阻止在表单中写入 .(点)的选项。

Answer 1

我相信在 keyup 事件发生时 Angular 色已经存在，并且您无法阻止已经发生的事情。尝试 keypress 事件:

<input (keypress)="_keyUp($event)">