Is there a way to create a modal that prompts the user to confirm if they want to leave the page without committing changes?
These changes are not made within a <form> element, but rather on a specific object.
I've attempted to use both $routeChangeStart and $routeChangeSuccess to detect when the user is trying to leave the page:
$scope.$on('$routeChangeStart', function(event, current) {
event.preventDefault();
ConfirmationModal.fire("Are you sure?", response => {
if (response) {
// How can I continue with the default action here??
}
});
}
The code above successfully stops the user from leaving the page. However, after confirming the modal, I'm unable to proceed with the page navigation. I can prevent the default action but not continue it.
I have also tried using:
$location.path(PATH) but this approach did not work either.
Furthermore, even if the user tries to leave the page again, the event.preventdefault still remains in effect.