单击element指令外部将不适用于多个实例。如何改进？

Question

我正在使用这个好的指令来抓住一个表的一边点击：

@Directive({
  selector: '[clickOutside]'
})
export class ClickOutsideDirective {
  constructor(private _elementRef: ElementRef) {}

  @Output()
  public clickOutside = new EventEmitter<MouseEvent>();

  @HostListener('document:click', ['$event', '$event.target'])
  public onClick(event: MouseEvent, targetElement: HTMLElement): void {
    if (!targetElement) {
      return;
    }

    const clickedInside = this._elementRef.nativeElement.contains(targetElement);
    if (!clickedInside) {
      this.clickOutside.emit(event);
    }
  }
}

但是，如果我在同一页面上有多个表，那么外部点击仅适用于第一个实例。如何使其适用于所有实例？