Sunday, April 20, 2014

AngularJS Tips / Progress bar on route change

If you need an effect of progressbar-like between different states of an application. Here is quick and dirty solution.


  • ui-router - of course you can use ngRoute, but I don't recommend so.
  • ngprogress-lite github official page - to get filling how it's works follow to the official page and look on the top of the page;


Use something like that between states:

$rootScope.$on('$stateChangeStart', function(){
  ngProgressLite. start ();

$rootScope.$on('$stateChangeSuccess', function(){

$rootScope.$on('$stateChangeError',  function(){

and fetch all needed dependencies in the resolve section of the states.

Good luck.

Follow the blog to get quick tips for software development.

No comments :

Post a Comment