After reviewing multiple posts and carefully examining the process of passing data from an Angular Component to MatDialog, I am facing an issue where 'undefined' is being returned when the dialog loads.
Below is the code snippet I have been working on:
import { MatDialog } from '@angular/material';
let dialogRef = this.dialog.open(MyComponent,
{
panelClass: 'custom-dialog-container',
data: { myObject: selectedObject},
disableClose: true
});
I inserted a breakpoint to confirm that selectedObject indeed contains all the fields and is not 'undefined'
In the constructor of my dialog component:
import { Component, OnInit, AfterViewInit, Inject, ViewChild, ElementRef } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
import { FormControl, Validators } from '@angular/forms';
constructor(public dialogRef: MatDialogRef<InventoryRequiredInfoViewerComponent>,
@Inject(MAT_DIALOG_DATA) public data: { myObject: any}) {
var test = data.myObject;
}
When I pause at this point, the value of data.myObject is coming up as undefined.
I have also included the dialog component in app.module.ts under both the declarations and entryComponents sections:
@NgModule({
declarations:
and
entryComponents:
Despite going through several discussions, I am unable to pinpoint why the data object is failing to be passed correctly to the MatDialog. Any assistance would be greatly appreciated.