當 Angular 在依賴注入期間無法解析某個類別的依賴時,就會發生這個錯誤。這最常影響使用建構函式注入的類別,因為 Angular 仰賴 TypeScript 中繼資料來判斷參數型別。
最常見的原因如下:
- 服務類別缺少
@Service()或@Injectable裝飾器 InjectionToken缺少適當的 provider 定義- 某個建構函式參數無法解析
NOTE: inject() 函式接受明確的權杖,因此「參數無法解析」的情境不會直接套用到它身上。不過,如果被注入的類別本身缺少 @Service(),而且它自己也有建構函式依賴,這個錯誤仍然可能發生。
常見情境
缺少 @Service() 裝飾器
當類別具有建構函式依賴,卻缺少 @Service() 裝飾器時,Angular 無法解析它的參數:
Missing @Service() decorator
export class UserClient {
constructor(private http: HttpClient) {} // Angular can't resolve this
}
加上 @Service() 裝飾器即可修復這個問題:
@Service()
export class UserClient {
constructor(private http: HttpClient) {}
}
無法解析的建構函式參數
當 Angular 無法判斷某個建構函式參數的型別時,也會出現這個錯誤:
@Service()
export class DataStore {
// Angular can't resolve 'config' without a provider
constructor(private config: AppConfig) {}
}
請確保所有建構函式參數都已設定 provider,或針對選擇性依賴使用 @Optional()。
如何除錯
錯誤訊息會包含無法解析的那個權杖的詳細資訊:
Can't resolve all parameters for X: (?, ?, ?)——其中的?標記代表無法解析的參數。請確認該類別具有@Service或@Injectable(),而且所有依賴都有 provider。Token X is missing a ɵprov definition——使用了某個InjectionToken,卻沒有為它設定 provider。請使用{provide: TOKEN, useValue: ...}為該權杖註冊一個值,或在權杖定義中加入預設 factory。
從錯誤的堆疊追蹤往回追蹤,找出有問題的注入發生在哪裡,接著確認下列事項:
- 該類別具有
@Service或@Injectable()裝飾器 - 所有建構函式參數都已註冊 provider
- 任何
InjectionToken都已設定 provider 或預設值