How do I get the angularJS routeProvider to perform an action before the route change?

Question

Let's say I have this config:

app.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider
        .when('/', { 
            templateUrl: 'app/partials/index.html',
            controller: 'defaultCtrl'
        })
        .when('/other', {
            templateUrl: 'app/partials/other.html',
            controller: 'errorCtrl'
        })
        .otherwise({ 
            templateUrl: 'app/partials/404.html'
        });
  }
]);

I'm looking for a place to do some basic, common maintenance code before the router calls the route. Say I'd like to clear the console log via console.clear() every time the route is changed. How and where would be the best place in the code to do that?

Answer 1

The $route service raise events like $routeChangeStart which you can use to perform such tasks. You can implement them using the $scope.$on method. Someting like

$scope.$on('$routeChangeStart',function(angularEvent,next,current) {
  //do you work here
});

Read the $route documentation to get idea on this and other such events.

Also $routeProvider configuration method when also can take a parameter resolve which actually is used to setup dependencies before the route is resolved. This resolve object map can also be used to achieve what you want to do.