In most cases you will want to use {static: false}
. Setting it like this will ensure query matches that are dependent on binding resolution (like structural directives *ngIf, etc...
) will be found.
Example of when to use static: false
:
@Component({
template: `
<div *ngIf="showMe" #viewMe>Am I here?</div>
<button (click)="showMe = !showMe"></button>
`
})
export class ExampleComponent {
@ViewChild('viewMe', { static: false })
viewMe?: ElementRef<HTMLElement>;
showMe = false;
}
The static: false
is going to be the default fallback behaviour in Angular 9. Read more here and here
The { static: true }
option was introduced to support creating embedded views on the fly. When you are creating a view dynamically and want to acces the TemplateRef
, you won't be able to do so in ngAfterViewInit
as it will cause a ExpressionHasChangedAfterChecked
error. Setting the static flag to true will create your view in ngOnInit.
Here is Stack overflow link https://stackoverflow.com/questions/56359504/how-should-i-use-the-new-static-option-for-viewchild-in-angular-8
No comments:
Post a Comment