Angular 自定义指令onkeypress不工作角度8

*我的自定义指令不适用于onkeypress，我只想允许数字作为输入，键盘不允许字母位，它不会给出任何错误，同时也不起作用*

  <input OnlyNumber #focus type="text" class="form-control" formControlName="financialYear"/>

仅编号.directive.ts

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

@Directive({
  selector: "[OnlyNumber]"
})
export class OnlyNumberDirective {
  @HostListener("keydown", ["$event"]) onKeyDown(event) {
    let e = <KeyboardEvent>event;
    if (
      [
        "Delete",
        "Backspace",
        "Tab",
        "Escape",
        "Enter",
        "NumLock",
        "ArrowLeft",
        "ArrowRight",
        "End",
        "Home",
        "."
      ].indexOf(e.key) !== -1 ||
      // Allow: Ctrl+A
      (e.key === "a" && (e.ctrlKey || e.metaKey)) ||
      // Allow: Ctrl+C
      (e.key === "c" && (e.ctrlKey || e.metaKey)) ||
      // Allow: Ctrl+V
      (e.key === "v" && (e.ctrlKey || e.metaKey)) ||
      // Allow: Ctrl+X
      (e.key === "x" && (e.ctrlKey || e.metaKey))
    ) {
      // let it happen, don't do anything
      return;
    }
    // Ensure that it is a number and stop the keypress
    if (
      e.shiftKey ||
      ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"].indexOf(e.key) === -1
    ) {
      e.preventDefault();
    }
  }
}

从“@angular/core”导入{指令，HostListener，ElementRef}；
@指示({
选择器：“[OnlyNumber]”
})
仅导出类编号指令{
@HostListener（“keydown”，[“$event”]）onKeyDown（事件）{
设e=事件；
如果(
[
“删除”，
“退格”，
“标签”，
“逃跑”，
“输入”，
“NumLock”，
“向左箭头”，
“右箭头”，
“结束”，
“家”，
"."
].indexOf（e.key）！=-1||
//允许：Ctrl+A
（e.key==“a”&（e.ctrlKey | | e.metaKey））||
//允许：Ctrl+C
（e.key==“c”&（e.ctrlKey | | e.metaKey））||
//允许：Ctrl+V
（e.key==“v”&（e.ctrlKey | | e.metaKey））||
//允许：Ctrl+X
（e.key==“x”&（e.ctrlKey | | e.metaKey））
) {
//让它发生吧，什么都不要做
返回；
}
//确保它是一个数字并停止按键
如果(
e、 移位键||
[“0”、“1”、“2”、“3”、“4”、“5”、“6”、“7”、“8”、“9”]。索引of（e.key）=-1
) {
e、 预防默认值（）；
}
}
}

如果您只需要数字输入，为什么不使用

type=“number”

。然而，它不会阻止用户输入字母表。您的指令在这方面起作用。另外，您不需要

让e=event，传入的事件已经是键盘事件。你可以说
onKeyDown（e）
。我想你还没有将指令导入应用程序模块你必须导出该指令（将该指令添加到声明和导出中）@NoOne:在你想使用它的模块中声明该指令。