Topic: close modal on back button click
Expected behavior
Modal and sidebar closes when back button is clicked on mobile Android
Actual behavior
Modal and sidebar remain visible, yet the view state below revert to previous state. How can I close the modal on back button click on Android mobile ?
Resources (screenshots, code snippets etc.)
I assume that there is a route change when you use back button. In this case you can listen to router events and use hide() method to close the modal.
this.router.events.subscribe((event: Event) => {
// close your modal here
});
The challenge is to close the modal instead of changing the route, in case a modal is open
Please use this code:
showModal() {
history.pushState(null, 'modalOpened');
this.modal.show();
}
hideModal() {
}
ngOnInit() {
this.location.onPopState(() => this.modal.hide());
}
I added fake history state in 'showModal' method to prevent route change on back button. Hope that helps.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Pro
- Premium support: No
- Technology: MDB Angular
- MDB Version: 8.1.1
- Device: NA
- Browser: NA
- OS: NA
- Provided sample code: No
- Provided link: No