angularjs - Angular, ui-router: show loading when change state -


is there way in angular when want switch state (ui-sref) can show load icon until second state loaded?

yes angular ui.router has events can listen:

$statechangestart - fired when transition begins.

$statechangesuccess - fired once state transition complete.

following can write preloader functionality

$rootscope.$on('$statechangestart', function(event, tostate, toparams, fromstate, fromparams) {    $rootscope.preloader = false; }    $rootscope.$on('$statechangesuccess', function(event, tostate, toparams, fromstate, fromparams) {        $rootscope.preloader = true;     } 

and write <div> in body element , show/hide variable

eg.

<body>      <div ng-show="preloader"></div> </body> 

Comments