angularjs - Loading data before loading controllers & views -

i'm having bit of trouble here.

i have angularjs application connects api , allows users login, register, etc. user receives token stored $localstorage (via ngstorage).

$localstorage[jwt] = data.token; 

when user visits application token stored, want present him loading page (regardless of page trying view) until verify token correct, , load views/controllers usual.

i've looked different ways of doing this, couldn't figure out any. pointers appreciated!

thanks.

you can use default ngroute module simple cases such this.

first configure route default resolve properties. here saying resolve should contain list of movies.

app.config(function($routeprovider){   $routeprovider.when('/',{     templateurl:'initial.html',     controller:'mainctrl'   })   .when('/two',{     templateurl: 'post.html',     controller: 'postctrl',     resolve: {       movielist: function($movies) {         return $movies.get();       }     }   })   .otherwise({     redirectto:'/'   }); }); 

secondly, interested hooking critical events of angular system. hence small example app want disable button used trigger page change, show text loading... when page change process starts...

(app.js):

app.controller('mainctrl', function($scope, $location) {   $scope.go = function() {     $location.path('/two');   };    $scope.$on('$routechangestart', function(evt){     $scope.showloading = true;     });    $scope.showloading = false;  }); 

(initial.html):

<a href="#/two" class="btn btn-default" ng-disabled="showloading">go</a> <br> <p ng-if="showloading" style="color:red">loading...</p> 

entire code here

more info ngroute