錯誤百科

水合在路徑上缺少節點

當 Angular 在水合過程中找不到節點時,生產建置會顯示這個錯誤。Angular 會沿著一條在伺服器端渲染時儲存的路徑尋找,但路徑上有個節點遺失了。這表示瀏覽器中的 DOM 與來自伺服器的 HTML 不同。

生產建置不包含錯誤訊息,所以你只會看到代碼 NG0509。開發建置會把同樣的問題顯示為錯誤 NG0502,訊息中會告訴你宿主節點與路徑。

常見原因

原因與錯誤 NG0500 相同。另外也要檢查應用程式以外的變更,例如 CDN 功能或瀏覽器擴充功能造成的變更。請閱讀水合指南中的 CDN 與瀏覽器擴充功能。

除錯方式

  • 如果你能在開發建置中看到這個問題,請使用開發建置。NG0502 訊息會告訴你宿主節點與路徑。
  • 比較生產環境的 HTML 與本機伺服器的 HTML。如果看到 __cf_email__ 元素,或發現註解節點遺失,原因很可能是某個 CDN 功能。
  • 在沒有安裝任何擴充功能的瀏覽器設定檔中開啟頁面。如果錯誤消失了,表示有擴充功能在變更頁面。