Angular 数字输入侧箭头选择器上的 6+ HostListener？

Question

我遇到一个问题，我有一个指令位于输入类型=数字上，那些带有用于向上和向下选择数字的侧箭头。

我正在使用 HostListener，但我无法找到一种方法来在用户单击侧边箭头时定位特定事件。

到目前为止我已经尝试过：

@HostListener(change'): 根本不起作用
@HostListener('ngModelChange')：当用户在
@HostListener('click')：这是唯一有效的事件，但该事件不包含输入值，因为它是通用点击事件。
@HostListener('input'): 仅当用户使用键盘输入数字时有效

有谁知道这个活动的官方获取方式吗？

 @HostListener('input', ['$event'])
  onEvent(event) {
    this._propagateTouch();
    this._propagateChange(event.target.value);
    // console.log('input');
  }

  @HostListener('click', ['$event'])
  onChange(event) {
    this._propagateTouch();
    this._propagateChange(event);
    console.log('arrow change');
  }

  @HostListener('keydown', ['$event'])
  handleKeyboardEvent(event) {
    this._propagateTouch();
    this._propagateChange(event.target.value);
  }

Answer 1

当元素发出配置的事件时，

Angular 执行为 HostListener 提供的 /configured 方法。 input 有两个活动 change 和 input https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number

当用户点击侧边向上或向下箭头事件时输入 @HostListener("input", ["$event"])。 Demo

  @HostListener("input", ["$event"])
    public onInput(event: any): void {
        console.log("input:"+ event);
        alert(event);
    }

 @HostListener("input", ["$event.target"])
    public onInput(event: any): void {
        console.log("input:"+ event);
        alert(event);
    }

Angular 数字输入侧箭头选择器上的 6+ HostListener？

Angular 6+ HostListener on numeric input side arrows selector?

html

directive

input

angular