錯誤百科

缺少值存取器

對於所有自訂表單控制項，你都必須註冊一個值存取器。

以下範例示範如何提供值存取器：

providers: [
  {
    provide: NG_VALUE_ACCESSOR,
    useExisting: forwardRef(() => MyInputField),
    multi: true,
  },
];

如何除錯

如上所述，你的控制項應該要有一個值存取器，卻缺少了。不過在實務上，造成這種情況的原因有很多。以下列出一些已知會導致這個錯誤的問題。

  1. 如果你定義了自訂表單控制項，有記得提供值存取器嗎？
  2. 你是不是把 ngModel 放在沒有值的元素上，或是無效的元素上（例如 <div [(ngModel)]="foo">）？
  3. 你是不是使用宣告在某個 NgModule 裡的自訂表單控制項？如果是，請確定你有匯入該 NgModule。
  4. 你是不是搭配第三方自訂表單控制項使用 ngModel？請確認該控制項有提供值存取器。如果沒有，請在控制項的元素上使用 ngDefaultControl。
  5. 你是不是在測試自訂表單控制項？請確定你的 testbed 設定有包含這個控制項。可以使用 Testbed.configureTestingModule 來設定。
  6. 你是不是搭配 webpack 使用 Nx 與 Module Federation？你的 webpack.config.js 可能需要額外設定，才能確保 forms 套件被共用。