I have an application that use @ViewChild and below is the code I have
@ViewChild('paginator', { read: MatPaginator, static: true}) public paginator: MatPaginator;
on the front I am using
<mat-paginator [ngStyle]="{'display': orders.length > 0 ? 'flex': 'none' }" #paginator>
and I have implemented AfterViewInit and this is the code I have just to check that the paginator has been initialised:
ngAfterViewInit(): void {
console.log('tab group', this.paginator);
}
but the this.tabGroup is undefined and hence I can't set it's property. What am I doing wrong.
Thanks
Since Angular 8 ViewChild
and ContentChild
decorators must have a new option called static.
If you add static: true
on a dynamic element (wrapped in a condition or a loop), then it will not be accessible in ngOnInit
nor in ngAfterViewInit
.
Setting it to static: false
should behave as you're expecting it to.
Also, when updating to Angular 8, in the command line there will be a message explaining the new ViewChild
and ContentChild
changes, and a link this documentation page, and here's the pull request of the changes, with some explanations. This might help wrapping your head around the changes.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With