Двойная кликабельная карта для начальной загрузки - угловая 5

Question

Я пытаюсь создать Bootstrap card, который может вызывать два моих метода.

<div (click)="TEST1()" class="card" style="width: 18rem;">
  <div class="card-body">
    <h5 class="card-title">Card title</h5>
    <button (click)="(TEST2)">TEST2BUTTON</button>
  </div>
</div>

Тем не менее, и на самом деле, имеет смысл, когда я нажимаю, он всегда будет вызыватьTEST1().Есть ли способ позвонить TEST2() при нажатии на button?

Answer 1

Вы должны использовать stopPropagation() внутри своего обратного вызова события.

Измените свой шаблон на это, обратите внимание на передаваемый параметр $event:

 <button (click)="onClick2($event)">TEST2BUTTON</button>

и в вашем компоненте:

onClick2(event: MouseEvent): void {
  event.stopPropagation();
}