angular - 停止鼠标事件传播

Question

在 Angular 中停止鼠标事件传播的最简单方法是什么？

我应该传递特殊的 $event 对象并自己调用 stopPropagation() 还是有其他方法。

例如在 Meteor 中，我可以简单地从事件处理程序返回 false。

Answer 1

如果您希望能够将此添加到任何元素而不必一遍又一遍地复制/粘贴相同的代码，您可以制定一个指令来执行此操作。就这么简单:

import {Directive, HostListener} from "@angular/core";
    
@Directive({
    selector: "[click-stop-propagation]"
})
export class ClickStopPropagation
{
    @HostListener("click", ["$event"])
    public onClick(event: any): void
    {
        event.stopPropagation();
    }
}

然后只需将它添加到您想要它的元素上:

<div click-stop-propagation>Stop Propagation</div>