Angular 5 - 在输入更改时使用字符串替换更新我的模型

Posted 2023-02-16

【中文标题】Angular 5 - 在输入更改时使用字符串替换更新我的模型

【英文标题】：Angular 5 - Update my model with string replace on input change

【发布时间】：2018-12-19 11:00:35

【问题描述】：

我的要求如下，

我有一个文本字段，它应该只接受数字。 当我输入任何其他字符时，它不应该被允许（即它不应该显示在文本框中）。 我不能使用 输入类型编号，因为它允许 "-"、"+" 和 e。

我尝试使用许多事件，例如 ngModelChange、keypress、keydown、input、change 。 但它们都没有按预期工作。

我在下面的链接中重新创建了我的问题，

https://stackblitz.com/edit/angular-en6w18

任何帮助表示赞赏。 谢谢。

【问题讨论】：

为什么 keydown 不起作用？

当我使用 keydown 时，我输入的最后一个字符仍然显示并且没有被删除。我不知道为什么会这样。您可以在我分享的链接中检查行为。

检查一下，它可以工作stackblitz.com/edit/angular-tkaeug

谢谢，它有效。

【参考方案1】：

如果输入的字符不是数字，你应该调用 preventDefault

这是它的工作原理：

https://stackblitz.com/edit/angular-tkaeug

注意：不要忘记允许 alt、ctrl、command、退格...等