Angular5中的父子元素单击事件处理

Question

在Angular5中，

我有下面的代码。

   <div (click)="abc()">
    some content
    <button (click)="xyz()">Click</button>
    </div>

每当我单击按钮时，两个方法都在调用。但是我想调用一个方法。它属于按钮单击。

如何在Angular5中处理它

谢谢

Answer 1

您需要使用xyz方法中的stop the propagation of the event：

因此在模板中：

<div (click)="abc()">
    some content
    <button (click)="xyz($event)">Click</button>
</div>

在组件中

xyz = function (event: Event) {
    event.stopPropagation();
    ... // rest of the stuff 
}