CODEWITHSUNDEEP
angulartypescriptangular-materialmat-dialog
Andrés
Andrés

Reputation: 43

Can't pass data to mat dialog

I have a problem I need to pass an object to a mat-dialog. When I consult the value of the object, it is shown with all its properties, the problem occurs when I need to access the properties, they are shown as undefined.

Main Component:

EditDialog(nameInput: String, emailInput: String) {
    const dialogInstance = this.dialog.open(EditDialogComponent,
      {
        width: "40%",
        disableClose: true,
        data: { person: {name: nameInput, email: emailInput } }
      }      
      );
  }

Dialog Component:

constructor(private _formBuilder: FormBuilder,
            @Inject(MAT_DIALOG_DATA) private person: any
            ) { 
                console.log(this.person); <-- show object data
                console.log(this.person.name); <-- show undefined                
              }

Thanks any help

Upvotes: 0

Views: 3600

Answers (1)

Nizar Khsib
Nizar Khsib

Reputation: 100

your error is that the @Inject(MAT_DIALOG_DATA) private person: Person should not be declared as Person object.

Instead, you must do like follows

constructor(private _formBuilder: FormBuilder,
            @Inject(MAT_DIALOG_DATA) private _data: any
            ) { 
               //like this you'll get the person name ;)
                console.log(this._data.person.name);                     
              }

Upvotes: 1

Related Questions