Angular Material Dialog: resolver with data?

Viewed 995

Is it possible add a resolver to angular material dialog so that some data can be pre-loaded before the actual dialog is loaded?

PS: I don't need to open the dialog from the url, but on a click of a button.

1 Answers

Indeed, there is nothing special about this:

1) HTML:
(click)="onClickOpenDialog()"

2) TS

onClickOpenDialog() {
  this.myService.getMyData().subscribe(receivedData => {
    let dialogRef = dialog.open(YourDialog, {
      data: { myData: receivedData },
    });
  });

3) Your dialog:

@Component({
  selector: 'your-dialog',
  template: '...',
})
export class YourDialog {
  constructor(@Inject(MAT_DIALOG_DATA) public myData: any) { }
}
Related