Angular2 material dialog self close

43,402

If you wanna close it from the dialog:

constructor(private dialogRef: MatDialogRef<MyDialogComponent>){ }

closeDialog(){
  this.dialogRef.close();
}

If you wanna close it from the parent of the dialog:

constructor(private matDialog: MatDialog){}

//anywhere
let dialogRef = this.matDialog.open(MyDialogComponent);
dialogRef.close();
Share:
43,402
Lahiru Chandima
Author by

Lahiru Chandima

Professional software developer

Updated on February 11, 2021

Comments

  • Lahiru Chandima
    Lahiru Chandima over 3 years

    I used angular2 material MdDialog to show a form.

    When user submits the form, a request is sent to the backend and if the request is successful, I need to close the dialog. If backend request failed, I need to keep the dialog open.

    I can close the dialog by using a button like below.

    <button md-raised-button md-dialog-close>Cancel</button>
    

    But, in this case, I only need to close the dialog only if the backend request is successful, so I need a way to programmatically close the dialog.

    The component which is shown inside the dialog doesn't have the dialog ref, and I don't know any other way to self close the dialog from the component.

    Is there any way I an close the dialog from within the component inside the dialog?