пользовательская директива onkeypress не работает Angular 8

Question

* моя пользовательская директива не работает для onkeypress, я хочу просто разрешить ввод цифр, клавиатура не должна разрешать буквы, она не выдает никаких ошибок и в то же время не работает *

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

only-number.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();
    }
  }
}