如何知道在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 - What is the right way to "wait for operation"?