How can I resolve data for all states with Angular UI Router?

In my application, each route requires account information to be retrieved from my API before rendering. For this, I use ngRoute:

$rootScope.$on('$routeChangeStart', function(event, next, current) {
    next.$$route.resolve = next.$$route.resolve || {};

    next.$$route.resolve.authorizationCheck = function() {
        return deferredAccountData.promise;
    };
});

Therefore, before each route, a solution authorizationCheckthat returns a promise must be resolved. It works great.

Now I'm moving on to using the UI Router, and I need to keep this functionality. What are some possibilities for this?

One option that I can think of is using nested states and having all the inheritance paths of permissions from the parent state. Although I would prefer not to nest if possible. Are there any other options?

+4
2

, ui-router . .

$stateProvider
.state('app', {
  url: "/",
  resolve: {
    authorizationCheck: function() {
       // Do your API checks or whatever
    }
  }
})
.state('app.somepage', {
  url: "/somepage",
  templateUrl: "partials/some.page.html",
  controller: function($scope) {

  }
})

, Auth , .

+5

, , , stateChangestart stateChangeSuccess, - . , , .

+1

All Articles