Is there any way to get the height of components such as nz-header,nz-breadcrumb?

Angular uses nz-zorro, hoping to get the height of the nz-header component, using the following methods:

<nz-header style="background: -sharpfff; padding:0;" -sharpheader>
  <i class="trigger" nz-icon [type]="isCollapsed?"menu-unfold":"menu-fold"" (click)="isCollapsed=!isCollapsed"></i>
</nz-header>

@ViewChild("header") header: ElementRef;

console.log(this.header.nativeElement.offsetHeight);

in this way, the code will report an error. Header does not have the attribute of nativeElement. How can I get the height of the nz-header component?
Thank you.

Jun.22,2022

Please manipulate the template variable in the correct life hook.

try

ngAfterViewInit(){
    console.log(this.header.nativeElement.offsetHeight);
}
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b30642-2b259.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b30642-2b259.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?