material design modal pass data code example

Example: how sent data to dilaog angular material

// app.component.ts
import { Component } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { MyDialogModalComponent } from './modals/my-dialog-modal/my-dialog-modal.component';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'angular-material-tree-tutorial';

  dialogValue: string;
  sendValue: string;

  constructor(
    public dialog: MatDialog
  ) { }


  openDialog(): void {
    const dialogRef = this.dialog.open(MyDialogModalComponent, {
      width: '250px',
      backdropClass: 'custom-dialog-backdrop-class',
      panelClass: 'custom-dialog-panel-class',
      data: { pageValue: this.sendValue }
    });

    dialogRef.afterClosed().subscribe(result => {
      console.log('The dialog was closed', result);
      this.dialogValue = result.data;
    });
  }

}