0

My situation is I want to open a dialog component, in which I pass a value from the main component, then after closing I just want to refresh the table in the main component, but without using any subscription or passing any value to the main component.

The code is like this:

openDialog(employeeId: string): void {
  let dialogRef = this.dialog.open(ExampleDialogComponent, {
      width: '250px',
      data: employeeId,
  });
    
  dialogRef.afterClosed().subscribe(result => {
     console.log('The dialog was closed');
     this.dataSaved = true;
     this.employeeIdUpdate = null;
     this.employeeForm.reset();
     this.loadAllEmployees();
  });
}

Now the variable result is coming as undefined, but can I not use the subscribe at all? I just want the below statement and function to work after I close the dialog. Thank you

Dmitry S.
  • 1,544
  • 2
  • 13
  • 22
Rahul
  • 21
  • 8
  • Is ```dialog``` an extern library? Can you provide information which library is being used here? – Lukasz Gawrys Aug 22 '21 at 07:39
  • `dialog` is `matDialog` – Rahul Aug 22 '21 at 10:49
  • It's mat-dialog structure and there is no problem to use subscribe so if result is undefined maybe you miss `@Inject(MAT_DIALOG_DATA) public data: DialogData) ` in ExampleDialogComponent constructor – kian Aug 22 '21 at 10:59

1 Answers1

0
  1. afterClosed() is the best solution if you want to perform some actions after the close. If you don't want to see that 'result' there because it's always empty, you can remove it. Don't worry about that subscription, it will emit just one value, and no need to unsubscribe it onDestroy.

    dialogRef.afterClosed().subscribe(() => {...

  2. You can also do actions in modal, you just need to bind click event on the close button and do actions there, but this will not help you that much in your situation.

N.Tasikj
  • 366
  • 1
  • 4