AngularJS loading progress bar

Question

When using AngularJS and doing a redirect using $location.path(\'/path\') the new page takes a while to load, especially on mobile.

Is there a way to ad

Answer 1

if it is the next route that takes time to load e.g. making ajax call before the controller is run (resolve config on route) then make use of $route service's $routeChangeStart, $routeChangeSuccess and $routeChangeError events.

register a top level controller (outside ng-view) that listens to these events and manages a boolean variable in its $scope.

use this variable with ng-show to overlay a "loading, please wait" div.

if the next route loads fast (i.e. its controller runs quickly) but data that are requested by the controller take a long to load then, i'm afraid, you have to manage the visibility state of spinners in your controller and view.

something like:

$scope.data = null;
$http.get("/whatever").success(function(data) {
    $scope.data = data;
});

...