Skip hydration flag is applied to an invalid node

このエラーは、ngSkipHydration 属性が適切でないDOMノードに適用された場合に発生します。ngSkipHydration 属性は、テンプレートまたはホストバインディングを介して直接、コンポーネントホストノードのみに適用できます。他のDOMノードには適用できず、このエラーが発生する以外、効果はありません。

水和の詳細については、このガイドをご覧ください。

次の例では、エラーが発生します。

例 1

この例では、ngSkipHydration 属性は、ディレクティブのホストバインディングを使用して <div> に適用されています。<div> はコンポーネントホストノードとして機能しないため、Angularはエラーをスローします。

@Directive({  selector: '[dir]',  host: {ngSkipHydration: 'true'},})class Dir {}@Component({  selector: 'app',  imports: [Dir],  template: `    <div dir></div>  `,})class SimpleComponent {}

例 2

この例では、ngSkipHydration はテンプレートを介して属性として <div> に適用されています。 <div> はコンポーネントホストノードとして機能しないため、Angularはエラーをスローします。

@Component({  selector: 'app',  template: `    <div ngSkipHydration></div>  `,})class SimpleComponent {}

エラーのデバッグ

不正なDOMノードから ngSkipHydration 属性を削除します。または、ngSkipHydration 属性をテンプレートまたはホストバインディングを介してコンポーネントホストノードに移動します。