Search code examples
javascriptangularangular17

How to provide pipes in services in Angular 17 with no NgModule


I am trying to use titleCasePipe in my angular service, I don't have NgModule and using the new ApplicationConfig way.

@Injectable({
  providedIn: 'root'
})
export class NameGeneratorService {
  // private titleCasePipe = inject(TitleCasePipe)
  constructor(private titleCasePipe: TitleCasePipe) { }

I tied both ways for injection ^^

I keep getting NullInjectorError: No provider for _TitleCasePipe! error.

I tried this, still same error

export const appConfig: ApplicationConfig = {
  providers: [
    provideRouter(routes),
    provideAnimations(),
    importProvidersFrom(TitleCasePipe),
  ]
};

Solution

  • Add the pipe to the providers :

      providers: [
        provideRouter(routes),
        provideAnimations(),
        TitleCasePipe,
      ]
    

    But honnestly, this is a bad practice. Pipes are only meant to be used in templates.

    If you want to inject such feature, it should be trough a service.