javascript – 如何手动触发点击事件？

我试图以编程方式触发文档.

我的test-comp显示在页面的多个位置,我想在单击test-comp或触发文档单击时将它们全部隐藏起来.

@Component({
  selector: 'test-comp',
  template: `<div *ngIf="showMe">stuff</div> and more…`
})

export class TestComponent {
  showMenu: boolean;

  constructor(public elementRef: ElementRef) {
  }

  @HostListener('document:click', ['$event'])
  documentClick(event: MouseEvent) {
    //hide my component when there is a document click    
     this.toggleComponent();
  }

  toggleComponent() {
    // I am trying to programmatically fire a document click here to hide all test-comp if the test-comp   
    // component itself is clicked
    // this.elementRef.nativeElement will select all test-comp component but not sure what to do next
    this.showMe = !this.showMe;
  }

我不知道如何在我的toggleComponent方法中以编程方式单击文档.有办法吗？非常感谢！

解决方法:

您可以使用HTMLElement.click()触发任何元素上的单击事件：

document.getElementById('myEl').click() # or the hacky id reference `myEl.click()`

您不能单击文档,因为它不是渲染元素.但你可以点击整个身体：

document.body.click()