NullInjectorError: No provider for DecimalPipe

Question

I have implemented lazy loading in my application. One of my services needs to include DecimalPipe.

service --> shared module --> App module

This is my structure. I've already included "CommonModule" in app.module.ts and My service also needs Decimal Pipe.

Including "Decimal Pipe" in my shared module gives the below error:

Type DecimalPipe is part of the declarations of 2 modules: CommonModule and SharedModule! Please consider moving DecimalPipe to a higher module that imports CommonModule and SharedModule. You can also create a new NgModule that exports and includes DecimalPipe then import that NgModule in CommonModule and SharedModule.

So Since it is already part of Commons Module, why doesn't it take Decimal pipe from Commons Module. ? If It is not declared, below error is shown

NullInjectorError: No provider for DecimalPipe!

Please let me know how to handle this error. Thanks in advance!

Does your `CommonModule` export the `DecimalPipe` to allow other modules to access it? Can you show us an abbreviated code snippet of the modules so we can see how you are exporting/importing? — nephiw, Oct 07 '19 at 21:56

score 30 · Answer 1 · answered Apr 23 '20 at 21:21

You need to provide the DecimalPipe in the Module that provides your Service

for example, if your service is "providedIn: 'root'" then you should provide the DecimalPipe in your AppModule like that:

import {DecimalPipe} from '@angular/common';
@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [ ],
  providers: [DecimalPipe],
  exports: [],
  bootstrap: [AppComponent]
})
export class AppModule {
}

NullInjectorError: No provider for DecimalPipe

1 Answers1