Browser navigation block

angular-block-ui

Description

Whenever an async request has been made in a single page app to the backend server, you'll probably want to wait untill it has completed. The registered callbacks will execute even if the user has navigated away from the originating view/controller. The angular-block-ui module can disable navigation until al the requests have been completed and still allows you to change the url whenever this is done via the $location service.

Demostration

The current active element in the pagination below is determined by the index search argument passed in the url. When this page is loaded the controller will add some history urls to the browser. Navigating back and forward should highlite the current index in the pagination.

The button "Start Block" will start a user interface block and does not allow the user to navigate back and forward until the block has been lifted.

The button "Start Block and Change Location" also starts a user interface block, but changes with a certain interval the url search parameters.


Enable browser navigation block

Navigation blocking can be enabled by setting the blockBrowserNavigation property of the blockUIConfig to true.

angular.module('myApp').config(function(blockUIConfig) { 
  blockUIConfig.blockBrowserNavigation = true;
});