NullInjectorError 🅰️ Angular

Angular: NullInjectorError: No provider for X!

Angular’s dependency injection couldn’t find a provider for a service/token the component needs.

Seen on: Angular

Meaning

Common: HttpClient without provideHttpClient(), a service without providedIn: 'root', standalone components missing imports/providers, or injecting a service from a lazy module elsewhere.

Common causes

  • provideHttpClient() missing (No provider for HttpClient)
  • Service not providedIn root nor listed in providers
  • Standalone component missing the provider/import
  • Token used outside its injector scope

⚡ Quick fix

  1. Add provideHttpClient() in app.config.ts
  2. Use @Injectable({ providedIn: 'root' })
  3. Provide the service in the component/route providers

Detailed fix by platform

TypeScript

  1. typescript
    export const appConfig: ApplicationConfig = {
  providers: [provideRouter(routes), provideHttpClient(withInterceptorsFromDi())]
};

How to diagnose

  1. Token — Which provider is missing?
  2. Scope — Where is it provided?

🔧 Still not fixed?

Many errors look alike. If the steps above didn’t solve it, one of these is probably what you’re facing:

🧠 Still stuck? Analyze your error

Paste the full message, response headers or stack trace — we'll detect the platform and point to the most likely cause.