Components: NullInjectorError: No provider for MatDialogRef!

[rc21net]

Hi
I can't inject MatDialogRef as it described in documentation https://material.angular.io/components/dialog/overview
When i'm trying to do it i'v got error:
ERROR Error: StaticInjectorError[MatDialogRef]:
StaticInjectorError[MatDialogRef]:
NullInjectorError: No provider for MatDialogRef!

[crisbeto]

It's hard to know what's going on without seeing a code sample. All of the examples in the docs should work since they're being used to build the live examples.

[jelbourn]

Closing this issue as it does not follow the issue template. Please file a new issue that follows the template, which gives the team the information needed to investigate.

[rc21net]

i'v solved the problem by importing MatDialogModule, MatDialog and MatDialogRef from @angular/material/dialog instead of @angular/material

[jepetko]

for some reason MatDialogRef cannot be injected during the unit test execution. On the contrary, in the application it works like a charm.

My temporary workaround was to add a dummy value for MatDialogRef in the unit test as follows:

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [WizardModule, ..., NoopAnimationsModule],
      providers: [
        // workaround: why I can't inject MatDialogRef in the unit test?
        {provide: MatDialogRef, useValue: {}},
        ....
      ]
    });
  }));

What the WizardModule looks like:

@NgModule({
  imports: [MatStepperModule, MatButtonModule, MatIconModule, MatDialogModule,
    ... own modules],
  declarations: [WizardComponent],
  entryComponents: [
    WizardComponent
  ],
  exports: [WizardComponent]
})
export class WizardModule {
}

Template (somewhere in wizard.component.html) NOTE: mat-dialog-close is a directive with MatDialogRef dependency injection:

<div class="wizard-head">
  <button mat-icon-button mat-dialog-close class="close">
    <mat-icon aria-label="Close dialog">close</mat-icon>
  </button>
</div>

[JPtenBerge]

@jepetko Thanks for that, worked. I also had this in my dialog component constructor: @Inject(MAT_DIALOG_DATA) private data: any,. Simply providing it manually solved it:

providers: [
    { provide: MatDialogRef, useValue: {} },
    { provide: MAT_DIALOG_DATA, useValue: [] },
    // ...
]

It also surprised me that I couldn't configure any entryComponents when calling TestBed.configureTestingModule(), it has been talked about though.

[jmdobry]

I am also running into this problem. My dialog component works fine in my app, but in the test I get

Failed: StaticInjectorError(DynamicTestModule)[MatDialogTitle -> MatDialogRef]:
      StaticInjectorError(Platform: core)[MatDialogTitle -> MatDialogRef]:
        NullInjectorError: No provider for MatDialogRef!
    Error: NullInjectorError: No provider for MatDialogRef

even when adding MatDialogModule directly to the test bed module.

[azanebrain]

Any MatDialogRef methods being used also need to be included in the providers:

providers: [{
  provide: MatDialogRef,
  useValue: {
    close: (dialogResult: any) => { }
  }
}]

An official MatDialogRefTestingMock type asset would be really helpful

[ghost]

The same happens in unit tests for a BottomSheet based component with MAT_BOTTOM_SHEET_DATA and MatBottomSheetRef. Can be worked-around as above:

      providers: [
        { provide: MatBottomSheetRef, useValue: {} },
        { provide: MAT_BOTTOM_SHEET_DATA, useValue: {} }
      ],
      imports: [
         MatBottomSheetModule
      ]

[maccurt]

Thank you, this saved me hours!!!!!

[MohitKS5]

The same issue also occurs in app for me. ng serve
@JPtenBerge it won't allow to use methods like close().
@azanebrain now close does nothing for me.

[edbzn]

Still happening with @angular/material: 7.3.7, I'm not sure to understand why MatDialogRef cannot be injected during unit test execution.

[nonbob]

Can anybody point me to a definition of "correctly written application" (specific to Angular, modules and injectors) that is practical, apropos, reasonably detailed and less than a book? I'm assuming I'm not the only person in this well-visited thread to have seen this comment in the NullInjector source code:

if (notFoundValue === THROW_IF_NOT_FOUND) {
// Intentionally left behind: With dev tools open the debugger will stop here. There is no
// reason why correctly written application should cause this exception.
// TODO(misko): uncomment the next line once `ngDevMode` works with closure.
// if(ngDevMode) debugger;
const error = new Error(`NullInjectorError:   No provider for ${stringify(token)}!`);
error.name = 'NullInjectorError';

[joerossetter]

i was getting this error:
StaticInjectorError(DynamicTestModule)[MyDialogComponent -> MatDialogRef]: StaticInjectorError(Platform: core)[MyDialogComponent -> MatDialogRef]: NullInjectorError: No provider for MatDialogRef!

after rebuilding the entire component line by line out of frustration, i found my issue was an automatic IDE import that resolved to @angular/material/dialog instead of @angular/material... hopefully this helps somebody!

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}