How to pass data to dialog of angular material 2

Question

I am using dialog box of angular material2.

I want to pass data to the opened component. Here is how I am opening dialog box on click of a button

let         


        

Answer 1

UPDATE 2 (Angular 5+)

This answer is rather outdated. Take a look at epiphanatic's answer instead.

UPDATE

You can use dialogRef.componentInstance.myProperty = 'some data' to set the data on your component.

You would need something like this:

let dialogRef = this.dialog.open(DialogComponent, {
            disableClose: true,
        });
dialogRef.componentInstance.name = 'Sunil';

Then in your DialogComponent you need to add your name property:

...

@Component({
  ...
})
export class DialogComponent {
   public name: string;

   ...

}

Text below is not valid in newer versions of @angular/material

I didn't find any documentation on this, so i started looking into the source code too. Because of that, this might not be the official way of to do.

I successfully located the data in dialogRef._containerInstance.dialogConfig.data;

So what you can do is for example

let name = dialogRef._containerInstance.dialogConfig.data.name;
console.log(name); // Sunil