muzzledBYbrass
muzzledBYbrass

Reputation: 276

Prevent state change on back button with UI-Router

There is a page editor in my app, and I want it to prompt a user to save if they try to navigate away when there are unsaved changes. I managed to cover my bases with regards to window reload and links, but I can't seem to prevent UI-Router from engaging in the state change with a back/forward button click.

I am trying to do it from the $stateChangeStart event and am a little unsure of how to halt the state change. I have also tried $window.onpopstate but it seems to be one step behind the router.

Upvotes: 3

Views: 2986

Answers (1)

tvann
tvann

Reputation: 272

Try this:

$scope.$on('$stateChangeStart', function(event) {
    if ($scope.unsavedChanges) { //or however you check for unsaved changes
        event.preventDefault();
    }
});

Upvotes: 4

Related Questions