Na maioria dos casos, você vai querer usar {static: false}. A configuração dessa maneira garantirá que sejam encontradas correspondências de consulta dependentes da resolução de ligação (como diretivas estruturais *ngIf, etc...).
Exemplo de quando usar 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;
}
O static: falseque vai ser o comportamento fallback padrão no Angular 9. Leia mais aqui e aqui
o { static: true } opção foi introduzida para oferecer suporte à criação de visualizações incorporadas em tempo real. Quando você cria uma visualização dinamicamente e deseja acessar TemplateRef, não poderá fazer isso, ngAfterViewInitpois isso causará um ExpressionHasChangedAfterCheckederro. Definir o sinalizador estático como true criará sua visualização no ngOnInit.
Mesmo assim:
Na maioria dos outros casos, a melhor prática é usar {static: false} .
Esteja ciente de que o { static: false } opção será padronizada no Angular 9. O que significa que a configuração do sinalizador estático não é mais necessária, a menos que você queira usar a static: trueopção.
Você pode usar o ng updatecomando angular cli para atualizar automaticamente sua base de código atual.
Para um guia de migração e ainda mais informações sobre isso, você pode conferir aqui e aqui
Qual é a diferença entre consultas estáticas e dinâmicas?
A opção estática para as consultas @ViewChild () e @ContentChild () determina quando os resultados da consulta ficam disponíveis.
Com consultas estáticas (static: true), a consulta é resolvida assim que a exibição é criada, mas antes da execução da detecção de alterações. O resultado, no entanto, nunca será atualizado para refletir alterações na sua exibição, como alterações nos blocos ngIf e ngFor.
Com consultas dinâmicas (static: false), a consulta é resolvida após ngAfterViewInit () ou ngAfterContentInit () para @ViewChild () e @ContentChild (), respectivamente. O resultado será atualizado para alterações em sua visualização, como alterações nos blocos ngIf e ngFor.