Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

using @viewChild in angular 8

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

like image 744
Jack M Avatar asked Dec 17 '22 16:12

Jack M


1 Answers

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.

like image 102
heunetik Avatar answered Dec 30 '22 06:12

heunetik