how to pass data from angular material dialog to parent component? : <p>I'm using angular 6 and I have a button which opens a dialog. in my dialog, I have a form that gets user's data and then I have two buttons to submit and cancel. I tried to show my form's data in the console but it returns undefined! whats the problem? here is part of codes:</p>

<p><strong>main.component.ts:</strong></p>

<pre><code>import { Work } from '../../../../classes/work_shift';
import { DialogContentComponent} from './dialog-content/dialog-content.component';
export class WorkShiftsComponent implements OnInit {
 shifts: Work[];
  name: string;
  start: string;
  end: string;
  constructor(public dialog: MatDialog, private shiftService: WorkShiftsService) { }

  ngOnInit() {
  }

  openDialog() {
    const dialogRef = this.dialog.open(DialogContentComponent, {
      width: '640px',
      disableClose: true,
      data: {name: this.name, start: this.start, end: this.end}
    });
    dialogRef.afterClosed().subscribe(result =&gt; {
      console.log('The dialog was closed');
      console.log(result);//returns undefined
    });
  }
}
</code></pre>

<p><strong>dialogContent.component.html:</strong></p>

<pre><code>    &lt;mat-dialog-content&gt;
  &lt;form class="example-form"&gt;
    &lt;div fxLayout="column" fxLayoutAlign="space-around" class="form"&gt;
      &lt;div class="input"&gt;
        &lt;mat-form-field class="input4"&gt;
          &lt;input matInput placeholder="Shift name"&gt;
        &lt;/mat-form-field&gt;
      &lt;/div&gt;
      &lt;div&gt;
        &lt;mat-form-field class="input input2"&gt;
          &lt;input matInput placeholder="Start" atp-time-picker&gt;
        &lt;/mat-form-field&gt;
        &lt;mat-form-field class="input input2"&gt;
          &lt;input matInput placeholder="End" atp-time-picker &gt;
        &lt;/mat-form-field&gt;
      &lt;/div&gt;
      &lt;br/&gt;
    &lt;/div&gt;
  &lt;/form&gt;
&lt;/mat-dialog-content&gt;
&lt;mat-dialog-actions&gt;
  &lt;button class="mat-button" mat-button (click)="onClose()"&gt;Cancel&lt;/button&gt;
  &lt;button class="mat-button" mat-button [mat-dialog-close]="data" cdkFocusInitial color="primary"&gt;Create&lt;/button&gt;
&lt;/mat-dialog-actions&gt;
</code></pre>
