-
-
Notifications
You must be signed in to change notification settings - Fork 38
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
How to close dialog on browser back navigation #66
Comments
Close it on component destroy |
Right. That will indeed close the dialog. But it doesn't stop navigation. What I would like is for hitting the back button in the browser to correspond to closing the dialog and nothing else. This is especially important for dialog that are very big and basically act like a page in front of another page. The user's expectation with those is to find themselves back where they opened the dialog if they hit the back button. I have found a way to do it, but I think it would be great if this was built-in to your library as a dialog instance option. Here is my solution: const closedModalRefs = new Set<string>();
@Component({
selector: 'in-listing-preview',
templateUrl: './listing-preview.component.html',
})
export class ListingPreviewComponent implements OnInit {
listingDetails?: ListingDetails;
constructor(public ref: DialogRef<ListingDetails>, private location: LocationStrategy, private router: Router) {}
ngOnInit(): void {
this.listingDetails = this.ref.data;
this.location.pushState('ListingPreviewModal', 'ListingPreviewModal', this.router.url, '');
this.location.onPopState(() => {
if (closedModalRefs.has(this.ref.id)) return;
closedModalRefs.add(this.ref.id);
this.ref.close();
});
}
} As you can see, if forces my Dialog Component to depend on LocationStrategy and Router, which is kind of weird and a concern that you wouldn't normally want to deal with at this level of abstraction. Having that mechanism built-in to your lib and exposed through instance config would be nice. If you think it would be a good idea and you accept PRs, I'm willing to take a crack at it. |
You are welcome to submit a PR |
My workaround:
|
I'm submitting a...
Current behavior
When a dialog is opened and the user clicks the browser back button, the dialog doesn't close.
Expected behavior
For the dialog to close when the browser back button is clicked.
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Just doesn't feel right to have navigation happen behind the dialog.
Environment
The text was updated successfully, but these errors were encountered: