有角度。如何定义外部点击，排除子部件？

有用于确定组件

@HostListener('document:click', ['$event', '$event.target']) 
public onClick($event, targetElement) { 
    const isClickedInside = this._elementRef.nativeElement.contains(targetElement); 
    if (!isClickedInside) { 
     this.onClickOutsideEvent.emit($event); 
    } 
}

为什么点击定义之外，如果点击境内关外的点击代码，但嵌套组件？

来源

2017-10-04 front

当您将其设置为您希望监视的元素的包装div上的侦听器时，上述代码的逻辑工作。该div应该是屏幕大小，并将接收文档上的所有点击事件。当点击不在该div内时，它就在您正在监视的元素内部，通过消除逻辑。我会把它完成以下：

@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); 
     } 
    }

demo

来源

2017-10-04 07:47:36 Vega

有角度。如何定义外部点击，排除子部件？

回答

相关问题