如何知道何時將元素添加到Angular 2上的DOM？

Question

我需要操作由*ngIf指令隱藏的DOM元素：

<div *ngIf="myBoolean">
    <canvas id="myElement"></canvas>
</div>

單擊按鈕后，我運行以下方法：

showMyElement(){
    this.myBoolean = true; //This shows the div containing myElement
    console.log(document.getElementById('myElement')); //This gives me null
}

但是如果我在看到myElement之后點擊另一個按鈕，那么我就不會得到null 。 我想當我第一次得到它時，它還沒有被添加到DOM中。 我怎么知道myElement被添加到DOM？ 是否有類似(ngModelChange)東西，但是當添加到DOM時？ 謝謝！

Answer 1

您可以手動運行更改檢測周期以確保更新視圖

constructor(private cdRef: ChangeDetectorRef) {}

showMyElement(){
    this.myBoolean = true; 
    this.cdRef.detectChanges(); // redraw view
    console.log(document.getElementById('myElement')); //This gives me null
}

也可以看看

• Angular 4 - “等待操作”的正確方法是什么？