AngularJS : How to use one resolve for all the routes of my application

Question

I would like to resolve the promise that loads the current user for all the pages of my application. Currently I repeat the resolve in every $routeProvider.when()

Answer 1

You could always wrap the existing when method on the $routeProvider with your own implementation.

var myModule = angular.module('myModule', ['ngRoute'])
   .config(['$routeProvider', function($routeProvider){

      var originalWhen = $routeProvider.when;

      $routeProvider.when = function(path, route){

         route.resolve = {
            'currentUser':function( UserService){            
              return UserService.getCurrentUser();
            }
         };

         return originalWhen(path, route);
      };   

   }]);

You probably want to add some error checking in there, and use something like underscores defaults method instead of just overwriting the existing resolve property, but at least this way you can guarantee all your routes will have what you want.

It's also easy enough to wrap this up into a helper method.

Answer 2

The @Josh answer is correct, except you have to invoke originalWhen function differently:

originalWhen.call($routeProvider, path, route);

Answer 3

Both @N13 and I could not make @Josh's solution work. But this did work for me:

    module.config(['$routeProvider', function($routeProvider){
        $routeProvider.accessWhen = function(path, route){
            route.resolve || (route.resolve = {});
            route.resolve.language = "something"
            return $routeProvider.when(path, route);
        };
    }]);

use with:

$routeProvider
        .accessWhen('/login', {
           ...
        });

Answer 4

I found that this case much better:

angular.extend({}, $routeProvider, {
  when: function(path, route) {
    route.resolve || (route.resolve = {});
    route.resolve = angular.merge({}, route.resolve, {
      chef: 'OrganizationCheckerProvider'
    });
    return $routeProvider.when(path, route);
  }
});

Answer 5

For the people stuck with old code bases.

const _when = $routeProvider.when;
$routeProvider.when = (path, route) => _when.call($routeProvider, path, {
  ...route,
  resolve: {
    ...route.resolve,
    'currentUser': [ 'UserService', UserService => UserService.getCurrentUser() ]
  }
});

Answer 6

For completeness, here is the whole solution, using angular instead of underscore, with a chainable 'when'. Nothing new in this code, just combined a bunch of the answers above.

var originalWhen = $routeProvider.when;

    $routeProvider.when = function(path, route) {
        route.resolve || (route.resolve = {});
        angular.extend(route.resolve, {
            CurrentUser : function(User) {
                return User.current();
            }
        });

        return originalWhen.call($routeProvider, path, route);
    };