为什么ViewChild ElementRef在ngAfterViewInit中的宽度和高度为0？

Question

我正在尝试根据元素的宽度和高度进行一些计算，但是由于某些原因，这些计算在AfterViewInit生命周期挂钩中都不立即可用（均为0）。尽管setTimeout确实可以解决问题，但我不喜欢它。是什么原因造成的？有没有更优雅的解决方案？@ViewChild('main') mainDiv: ElementRef;ngAfterViewInit() {  this.printMainHeight() // 0  // with setTimeout width is correctly retrieved ...  setTimeout(() => this.printMainHeight()) // 430}printMainHeight() {  console.log(this.mainDiv.nativeElement.getBoundingClientRect().height)     }的HTML<div class"main" #main>  <app-toolbar></app-toolbar>  <app-list></app-list></div>

Answer 1

有必要使用ngAfterViewChecked生命周期挂钩，而不是ngAfterViewInit。正如Angular的文档所说ngAfterViewChecked()：

在Angular检查组件的视图和子视图/指令所在的视图之后响应。

在ngAfterViewInit（）及其之后的每个ngAfterContentChecked（）之后调用。