Completed
Last Updated: 13 Jul 2021 13:15 by ADMIN
David Joffe
Created on: 14 Nov 2017 04:27
Category: Dialog
Type: Feature Request
3
Provide an API for closing a dialog instance from the dialog's component.
Currently there is no easy way to programmatically close a dialog from within the dialog component. Also it should be possible to a return a reason why the dialog was closed which may be different to the action buttons and the reason should be available when subscribing to the result stream 

Perhaps have a look at the ng-bootstrap dialog and implement something similar. See: https://ng-bootstrap.github.io/#/components/modal/api. If the content of the modal is a component, then nb-bootstrap can inject the dialog instance into the dialog component (using the NgbActiveModal class). The NgbActiveModal class can then be used to programmatically close / dismiss the modal from "inside" the component.
2 comments
ADMIN
Martin Bechev
Posted on: 13 Jul 2021 13:15

Here is an example of using close method of the DialogRef:

https://stackblitz.com/edit/angular-4wrcql?file=app/app.component.ts

Regards,
Martin
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Imported User
Posted on: 26 Jun 2018 19:04
I don't feel this one is too complicated. We simply need to pass the dialog's reference to the child component's instance and then we can use the close method from the child component.

let dialog = this.dialogService.open({
  content: ChildComponent
});

const instance = this.dialog.content.instance;

instance.dialog = this.dialog;

//Somewhere in your child component
if( this.dialog ){
    this.dialog.close();
}