Components: ERROR Error: No provider for Token MdDialogData!

Created on 13 Apr 2017  路  6Comments  路  Source: angular/components

Bug, feature request, or proposal:

As of 2.0.0-beta.3, you need to inject the MD_DIALOG_DATA token in order to access the data property of the MdDialogConfig object. If you inject the MD_DIALOG_DATA token into a component that will be loaded into the dialog, and you do not pass data in, you will get

Error: No provider for Token MdDialogData!

What is the expected behavior?

Do not throw an error and to return an empty object if none is passed in.

What is the current behavior?

Error: No provider for Token MdDialogData!

What are the steps to reproduce?

Plunker

What is the use-case or motivation for changing an existing behavior?

Which versions of Angular, Material, OS, browsers are affected?

Angular Material 2.0.0-beta.3
Angular 4.00

Is there anything else we should know?

P3 has pr

Most helpful comment

Small note for testing components which inject MAT_DIALOG_DATA:

constructor(
  public dialogRef: MatDialogRef<PopupDialogComponent>,
  @Inject(MAT_DIALOG_DATA) protected data: DialogData
)

You can add this to your TestBed configuration:

providers: [{
  provide: MatDialogRef,
  useValue: {}
}, {
  provide: MAT_DIALOG_DATA,
  useValue: {} // Add any data you wish to test if it is passed/used correctly
}]

All 6 comments

Throwing an error, if no data is supplied, was intentional, but I can see how it could hinder re-usability. I'll add a default value for it. Until it gets in you can work around it by making the data optional (e.g. @Optional() @Inject(MD_DIALOG_DATA) data: any).

@Optional() @Inject(MD_DIALOG_DATA) data: any

This solution is not working either.

Getting

Error: Uncaught (in promise): Error: No provider for t!

Small note for testing components which inject MAT_DIALOG_DATA:

constructor(
  public dialogRef: MatDialogRef<PopupDialogComponent>,
  @Inject(MAT_DIALOG_DATA) protected data: DialogData
)

You can add this to your TestBed configuration:

providers: [{
  provide: MatDialogRef,
  useValue: {}
}, {
  provide: MAT_DIALOG_DATA,
  useValue: {} // Add any data you wish to test if it is passed/used correctly
}]

data which you are passing to dialog might be misssing

Just for future reference.

This worked for me when I faced the same issue today. Add @Optional() to both injections e.g.

constructor(
    @Optional() public dialogRef: MatDialogRef<PopupComponent>,
    @Optional() @Inject(MAT_DIALOG_DATA) public data: any
) {}

They will have a null value if the component is not used as a popup. If I omit the @Optional() declaration from any of those two injections I get the same error.

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._

Was this page helpful?
0 / 5 - 0 ratings