Angular-app, authentication and order of resolvers in (ui-)router

Question

This questions refers to the angular-app project and the way it authenticates users.

The original implementation guards access to some urls by using resolve clause o

Answer 1

I love using the resolver pattern but find it very difficult to do these types of things in angular ui router.

one solution is to dependency inject the result of the authenticatedUser resolver into the api call resolver you want protected like:

$stateProvider
    .state('root.tickets', {
        url: '/tickets',
        views: {
            'container@': {
                templateUrl: 'tickets/tickets-list.tpl.html',
                controller:'TicketsViewCtrl',
                resolve:{
                  authenticatedUser: securityAuthorizationProvider.requireAuthenticatedUser,
                  ticketsy: function (Restangular, authenticatedUser) {
                    //Call to tickets must be authenticated
                    return Restangular.all('tickets').getList();
                  }
                }
            }
        }

This way the resolvers will run in a chain (authenticatedUser -> ticketsy) rather than async all at once.

I hope this helped.. wish there was a better way of doing it.. thats why im search through stack overflow.

Answer 2

Have you tried something like this.

return securityAuthorizationProvider.requireAuthenticatedUser().then(function() {
    return Restangular.all('tickets').getList();
});

Basically requireAuthenticatedUser returns a promise so you can chain it with the call to Restangular call.