Angular js - show/hide loading gif every new route

Question

I\'m trying to toggle (hide/show) a loading gif on every new route, so my logic would be:

• routeChangeStart = show loading gif
• routeChangeSuccess = hi

Answer 1

( A little too much to put in a comment )

I set the code up and saw that the loading variable was not updated each time and was due to the template caching, I guess the 'RouteChange' is not triggered.

Disabling the template caching will let your code run each time ..

app.run(function($rootScope, $location, $anchorScroll, $routeParams,$templateCache) {

   $rootScope.$on('$viewContentLoaded', function() {
       $templateCache.removeAll();
    });

   ....