測試代碼：

export abstract class GreetingService {abstract greet(name: string): string;}

加了@Injectable注解的實現類：

import { Injectable } from '@angular/core'; import { GreetingService } from './greeting.service';@Injectable({ providedIn: 'root'}) export class EnglishGreetingService extends GreetingService {greet(name: string): string {return 'Hello ' + name;}constructor(){super();console.log('English class created!');} }

試圖通過構造函數參數的方式注入：

錯誤消息：

core.js:6241 ERROR NullInjectorError: R3InjectorError(AppModule)[GreetingService -> GreetingService -> GreetingService]: NullInjectorError: No provider for GreetingService!at NullInjector.get (http://localhost:4201/vendor.js:8310:27)at R3Injector.get (http://localhost:4201/vendor.js:22317:33)at R3Injector.get (http://localhost:4201/vendor.js:22317:33)at R3Injector.get (http://localhost:4201/vendor.js:22317:33)at NgModuleRef$1.get (http://localhost:4201/vendor.js:39618:33)at Object.get (http://localhost:4201/vendor.js:37352:35)at getOrCreateInjectable (http://localhost:4201/vendor.js:12112:39)at Module.??directiveInject (http://localhost:4201/vendor.js:26132:12)at NodeInjectorFactory.AppComponent_Factory [as factory] (http://localhost:4201/main.js:122:289)at getNodeInjectable (http://localhost:4201/vendor.js:12257:44)

解決辦法

在module的providers區域里，為GreetingService維護具體的實現類：

providers: [{ provide: JerrySandBoxService },{ provide: GreetingService, useClass: EnglishGreetingService}]

問題即可解決：

要獲取更多Jerry的原創文章，請關注公眾號"汪子熙":

總結

以上是生活随笔為你收集整理的Angular 依赖注入的一个常见错误 NullInjectorError, No provider for XXX的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。