typescript - 输入类型为 "number" 时的自定义行为 [Angular]

使用 Firefox 时，用户可以在 <input type="number"/> 中输入字母。我通过使用自定义指令阻止了这种情况，该指令只允许字符 [0-9]。

import { Directive, ElementRef, HostListener } from '@angular/core';

@Directive({
  selector: '[appOnlyNumber]',
})
export class OnlyNumberDirective {
  readonly acceptedKeys = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];

  @HostListener('keydown', ['$event']) down(e: any) {
    if (!this.acceptedKeys.includes(e.key)) {
      e.preventDefault();
    }
  }

  constructor(private er: ElementRef) {}
}

然而现在我们的程序员在创建数字输入时需要记住始终包含此指令。我希望这个过程万无一失，这样就永远不会被忘记。

有没有办法至少提醒程序员他忘记添加这个指令？比如在构建后检查 DOM，当它包含一个数字输入框，但没有指令时，在控制台发送警告？

或者我可以覆盖默认输入 HTML 元素的功能，使其默认情况下只能阻止这些按键 （仅 0-9） 吗？

答案＃1

在指令中使用属性选择器：

@Directive({
  selector: 'input[type="number"]',
})