1

i am using material ui to open a component inside of a Mat-Dialog. When I close the dialog, my subscription to the dialogRef wont trigger.

The parentComponent calls the editCatering() to open the dialog.

parentComponent:

import { MatDialog } from '@angular/material/dialog';

export class BewirtungListTableComponent ...{
   
    constructor(..., public dialog: MatDialog,...) {}
    

editCatering(data){
        this.requestSub = this.guestService.getGuestsByCateringId(bewirtung.id).subscribe((guest: Guest[]) => {
            let dialogRef = this.dialog.open(BewirtungEditComponent, {
                data: {data, guest},
                disableClose: true,
                autoFocus: false 
            });

            dialogRef.afterClosed().subscribe(result=>{
                console.log("dialog closed")
                console.log(result)
            })
    };

Then the dialogComponent closes on the onSubmit() call;

...
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
...

export class BewirtungEditComponent ...
constructor(@Inject(MAT_DIALOG_DATA) public data,..., public dialogRef: MatDialogRef<BewirtungEditComponent>){}

onSubmit() {
...
            this.updateSub = this.bewirtungService.updateCatering(cateringCreate).subscribe(
                (b: Bewirtung) => {
                    ...
                    this.dialogRef.close(b)
                },
                () => this.notificationService.error('Die Bewirtung konnte nicht geändert werden.')
            );
        }
        else {...}
    }

I checked the dialogRef in the states of the parentComponent and the dialogComponent: They have the same ID and after closing the dialogRef`s state changes to 2.

Any idea why the dialogRef.afterClosed().subscribe() doesnt do anything?

UPDATE

I also tested to move the afterClosed().subscription to the dialogComponent:

onSubmit() {
            ...
            this.updateSub = this.bewirtungService.updateCatering(cateringCreate).subscribe(
                (b: Bewirtung) => {
                    ...
                    this.dialogRef.close(b);
                    console.log(this.dialogRef)
                    this.dialogRef.afterClosed().subscribe(()=>console.log("after closed editComponent"))
                },
                () => this.notificationService.error('Die Bewirtung konnte nicht geändert werden.')
            );
        }

But even there i dont get anything.

Nimantha
  • 6,405
  • 6
  • 28
  • 69
chrs
  • 11
  • 1
  • 3
  • 1
    are you sure `this.dialogRef.close(b)` is executed ? Is there any error in the console ? Sometimes the code crashed while closing the modal... – Random May 04 '21 at 16:04
  • yes. the dialog closes properly and there are no console errors. – chrs May 04 '21 at 16:34
  • to make sure i removed the form from the dialog and also all other functionality. still the same:the dialog closes, but the afterClosed() wont trigger. – chrs May 04 '21 at 16:48
  • Your code looks fine, no obvious reason for it not to work. Can you reproduce it in a plunker/fiddle/anything ? Otherwise, sometimes all you have to do is stop the server, and rerun ng serve... – Random May 04 '21 at 18:51
  • I also did that.. still doesnt work. I also tried to use the closeAll() on the dialog itself and subscribed to the dialog.afterAllClosed.. Same thing. it doesnt trigger. i did a simple rebuild in a stackblitz and there it worked. – chrs May 05 '21 at 06:54
  • Have you tried adding a second parameter (the error callback) to the subscribe of `afterClosed()` ? – Random May 05 '21 at 07:46
  • 2
    Quote: "are you sure this.dialogRef.close(b) is executed ? Is there any error in the console ? Sometimes the code crashed while closing the modal... – Random 16 hours ago" After checking again, I found the problem. onDestroy() I unsubscibe() from my subs and there was one subscription causing an error. I dont know why the console didnt show the error msg, but this was the reason it didnt work. Thanks a lot for your help! – chrs May 05 '21 at 08:42
  • same problem here, nothing makes any sense... – Mahmoud Kassem Nov 05 '22 at 15:11

0 Answers0