クリックイベントを手動でトリガーする方法はありますか？

Question

私はプログラムでクリックしてドキュメントをトリガしようとしています。

私の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メソッドの内部プログラムで文書のクリックを発射する方法がわかりません。それを行う方法はありますか？どうもありがとう！

Answer 1

あなたはHTMLElement.click()を使って任意の要素にclickイベントをトリガすることができます

document.getElementById('myEl').click() 

あなたはそれがレンダリングされた要素文書上クリックしないことができないので。文書や `ドキュメントまでのバブル任意の要素に

document.body.click()