角度解析所有状态

Question

I got a routeProvider for my states.

$routeProvider.
      when("/register",{
        templateUrl: "templates/register.html",
        controller: "RegisterCtrl",
        resolve: {
          user: function(Auth) {
            return Auth.resolveUser();
          }
        }
      }).
      when("/home",{
        templateUrl: "templates/home.html",
        controller: "HomeCtrl",
        resolve: {
          user: function(Auth) {
            return Auth.resolveUser();
          }
        }
      }). .... [.....]

Every state got a promise which resolves, when user-state is loggedIn. Then the code of the different controllers is executed. Now I want to have a mainController for the navigation bar, which should be present on all sites. The controller needs the userdata for checking for new messages etc.

Now: how is it possible to define the resolve globally in a root state (so i can access the userdata in the root controller for all sites) and all the other controllers execute their code only, if the promise from this roote state is resolved?

I hope I formulated my question understandable...

Answer 1

I think you're looking for something like $routeChangeStart , that is a way to execute something you want everytime the user changes his route inside your web app. Take a look at Route and this other question from stackoverflow. Hope it helps.

Answer 2

You can do this by defining your routes outside of the $routeProvider.when statements:

var routes = [
  {
    url: "/register",
    config: {
      templateUrl: "templates/register.html",
      controller: "RegisterCtrl"
    }
  },
  {
    url: "/home",
    config: {
      templateUrl: "templates/home.html",
      controller: "HomeCtrl"
    }
  }
];

Then iterating through your routes to extend the resolve property before registering them with the $routeProvider :

angular.forEach(routes, function (route) {
  var url = route.url;
  var routeConfig = route.config;

  routeConfig.resolve = angular.extend(routeConfig.resolve || {}, {
    // add your global resolves here
    user: function(Auth) {
      return Auth.resolveUser();
    }
  });

  $routeProvider.when(url, routeConfig);
});

Your Auth.resolveUser() should be responsible for returning the fulfilled promise if it was already resolved previously.