Este erro ocorre quando o atributo ngSkipHydration foi adicionado a um node DOM inapropriado. O atributo ngSkipHydration só pode ser aplicado a nodes host de components, seja diretamente no template ou através de um host binding. Ele não pode ser aplicado a outros nodes DOM e não terá efeito se feito assim, exceto por causar este erro.
Mais informações sobre hydration podem ser encontradas neste guia.
Os exemplos a seguir irão disparar o erro.
Exemplo 1
Neste exemplo, o atributo ngSkipHydration é aplicado a uma <div> usando host bindings de uma directive. Como a <div> não atua como um node host de component, o Angular lançará um erro.
@Directive({ selector: '[dir]', host: {ngSkipHydration: 'true'},})class Dir {}@Component({ selector: 'app', imports: [Dir], template: ` <div dir></div> `,})class SimpleComponent {}Exemplo 2
Neste exemplo, o ngSkipHydration é aplicado a uma <div> como um atributo através de um template.
Como a <div> não atua como um node host de component, o Angular lançará um erro.
@Component({ selector: 'app', template: ` <div ngSkipHydration></div> `,})class SimpleComponent {}Depurando o erro
Remova o atributo ngSkipHydration de quaisquer nodes DOM inválidos. Alternativamente, mova o atributo ngSkipHydration para o node host do component, seja em um template ou através de um host binding.