Hiding a MdDialog

[MaximeAnsquer]

Bug, feature request, or proposal:

Feature request

What is the expected behavior?

Ability to hide the MdDialog and then show it back, with the component inside of it not being changed.

What is the current behavior?

The component can only be closed, and the component inside is destroyed.

What are the steps to reproduce?

Open a dialog, change something inside it, close it, open it back, and see that the change is gone.

What is the use-case or motivation for changing an existing behavior?

For example with a form inside a MdDialog, resetting the form when the dialog is closed/hidden is very annoying.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 4.2.0-rc.2, Material 2.0.0-beta.6, any OS, any TypeScript version, any Browser

[julianobrasil]

Have you tried binding it to some property of the component that is calling it?

You can use an object (not a primitive type) and pass it to the dialog to initialize it (dialogRef.componentInstance.instanceObj = this.callingComponentObj), then if, inside the dialog, you bind the controls (with [(ngModel)], for example) to the attributes of the dialog's instanceObj, any change you do to them will be reflected in calling component's callingComponentObj and can be used in future calls to the dialog. If this dialog is called accross the app, you can think of a service to host callingComponentObj.

[MaximeAnsquer]

Nice idea, I will try that.

Thanks !

[moravcik]

Binding inputs is not a problem. In my case the UI inside of dialog is, let's say "expensive", e.g. multiple interactive maps. Building the dialog content UI every time is not very effective, I would need just to hide or show it.

[karol-depka]

Please increase the priority. I don't think this is minor. My dialog has expensive components inside (Google Maps) and every time the dialog is opened, the app progressively slows down, down to a crawl...

[willshowell]

@karol-depka, there is a "P3" duplicate at https://github.com/angular/material2/issues/6206. The official consensus seems to be:

Instead, I think it would make sense to add the ability to add/remove css classes to the dialog via MdDialogRef

It's open for community contribution if anyone cares to give it a shot!

[smkart]

Much need feature , I have child components inside the dialog window , for with previous instance and values are needed , I would be better just to hide and open the dialog instead of passing the reference each time it opens dialog

[xmlking]

Chat-Bot Dialog/Popup is potential examples for this use case.

[julianobrasil]

@willshowell submited an already merged PR about this topic: #14772.

[jelbourn]

Closing since MatDialogRef supports this now (via CSS classes)

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}