Angular событие щелчка определяет, является ли это щелчком мыши или клавишей ввода.

Question

У меня следующий код html, мне нужно определить, является ли это событие щелчком мыши или событием ввода с клавиатуры.

Html код

    <button mat-raised-button class="btn-enter-troubleshooting-attempts" 
(click)="triggerLog($event)"> Click/Enter </button>

Тип сценария

triggerLog(e): void {
    console.log('Log Attempt', e);
   //do some function based on the event
  }

Answer 1

вы можете добавить (keydown)="triggerLog($event)", затем проверить, какая клавиша нажата в app.component.ts "для ввода ключа"

triggerLog(e) { 
   if(e.code == 13) {
      console.log(e);
   }
}

, вы можете проверить коды клавиатуры из этого: [https://keycode.info/ ] [1] Я надеюсь, что помощь.

Я добавил ее в комментарий. Если вы хотите прослушать нажатие клавиши или нажатие клавиши без выбора:

ngOnInit(): void { window.addEventListener('keydown', this.triggerLog, true) } 

Answer 2

вам нужно только спросить о event.clientX, если любое значение имеет щелчок, иначе - ENTER

<form [formGroup]="form">
    <input formControlName="name">
    <button type="submit" (click)="triggerLog($event)">click</button>
</form>

  form=new FormGroup({
    name:new FormControl('')
  })
  triggerLog(event)
  {
    console.log(event.clientX)
  }

См. simple stackblitz

Answer 3

Используйте (keyup.enter) для привязки для ввода ключа. Используйте (щелчок) для прослушивания щелчков мыши.

Проверьте эту ссылку