@HostListener OnClick for outside click does not work in firefox(@HostListener OnClick 外部点击在 Firefox 中不起作用)

本文介绍了@HostListener OnClick 外部点击在 Firefox 中不起作用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

@HostListener OnClick 在 Firefox 中不起作用.我尝试了 onClick、onclick 和 onGlobalClick.它们都在 chrome 中工作，但在 Firefox 中没有.这是我的代码:

@HostListener OnClick does not work in firefox. I tried onClick, onclick and onGlobalClick. They all work in chrome but no one in firefox. Here is my code:

constructor(private elRef: ElementRef, private renderer: Renderer2) { }

@Output() offClick = new EventEmitter();

@HostListener('document:click', ['$event.path'])
public onGlobalClick(targetElementPath: Array<any>) {
  const elementRefInPath = targetElementPath.find(e => e === this.elRef.nativeElement);
  if (!elementRefInPath) {
    this.offClick.emit(1);
  }
}

推荐答案

这是我在所有浏览器中测试的结果:

Here is what I tested in all browsers and it works:

 @HostListener('document:click', ['$event', '$event.target'])
    onClick(event: MouseEvent, targetElement: HTMLElement): void {
        if (!targetElement) {
            return;
        }
        const clickedInside = this.elementRef.nativeElement.contains(targetElement);
        if (!clickedInside) {
            this.clickOutside.emit(event);
        }
    }

这篇关于@HostListener OnClick 外部点击在 Firefox 中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！