Угловой матовый стол отменить рябь

Question

У меня есть таблица угловых материалов с кликабельной строкой с эффектом matRipple. В таблице у меня есть кнопка в качестве одной из строк. Когда кнопка нажата, она генерирует событие, и до сих пор я останавливал распространение события, и это хорошо помогает предотвратить обнаружение события щелчка обоими элементами. Есть ли способ отменить эффект ряби родительской строки ТОЛЬКО при нажатии кнопки?

Answer 1

Пульсация использует mousedown а также mouseup события, и вы можете отключить или включить рябь родителей в обоих событиях:

  <div
    class="example-ripple-container mat-elevation-z4"
    matRipple
    [matRippleDisabled]="disabled"
  >
    <button (mousedown)="disabled=true" (mouseup)="disabled=false" mat-button>button</button>
  </div>

Answer 2

Просто остановите дальнейшее распространение события mousedown кнопки, используя stopPropagation метод, как показано ниже:

      <button (mousedown)="$event.stopPropagation()">