Программный запуск пульсации на кнопке Angular значок материала

Question

У меня есть две angular кнопки материала. Моя цель состоит в том, чтобы программно позволить ряби кнопки при нажатии определенной клавиши.

Взглянуть на проект стек-блиц: https://stackblitz.com/edit/angular-material-button-vphppo

Есть ли способ позволить кнопке пульсации при нажатии или при нажатии клавиши ровно один раз?

Я пробовал эти примеры Как программно вызвать эффект пульсации на Angular MatListItem?

• Но это позволяет кнопке дважды колебаться при нажатии.

Answer 1

MatButton обеспечивает прямой доступ к Ripple в текущем материале:

  @ViewChild('btnNext', {static: false}) btnNext: MatButton;

  @HostListener('document:keypress', ['$event'])
  handleKeyboardEvent(event: KeyboardEvent) { 
    if( event.key === 'a') {
      this.btnNext.ripple.launch({centered: true})
    }
  }

Вышеприведенное прообразует c пульсацию при нажатии «a».

https://stackblitz.com/edit/angular-3xgxiw