Angular UI-Router - 解析根状态中的数据并在 $stateChangeStart 中使用答案

【问题标题】：Angular UI-Router - Resolve data in root state and use in $stateChangeStartAngular UI-Router - 解析根状态中的数据并在 $stateChangeStart 中使用
【发布时间】：2015-06-12 08:11:56
【问题描述】：

我正在使用 Angular UI-Router 在我的前端应用程序中实现状态。我的抽象基本状态有一个resolve 组，我从我的所有子状态扩展而来，但我遇到了问题：

我查看了这个问答： How do I access the 'resolve' property of a UI-Router root state from $stateChangeStart? ...但它并没有真正回答我的问题。代码如下：

.state('app', {
    abstract: true,
    url: '/',
    templateUrl: 'build/views/layout/master.html',
    data: {
        doesRequireLogin: true
    },
    resolve: {
        principalRoles: function($q, User, RoleMapping, $rootScope) {

            var deferred = $q.defer();

            // Grab the current user, then attempt to find their roles
            User.getCurrent(
                function foundUser(user) {

                    RoleMapping.find({
                        filter: {
                            where: {
                                principalId: user.id
                            },
                            include: 'role'
                        }
                    }, function hasRoles(roleMappings) {

                        // Reduce the roles list to just the names of the roles
                        var rolesList = roleMappings.map(function(mapping) {
                            return mapping.role ? mapping.role.name : '';
                        });

                        $rootScope.user.roles = rolesList;

                        return deferred.resolve(rolesList);

                    }, function hasError(error) {
                        return deferred.reject(error);
                    });

                },
                function userError(error) {
                    return deferred.reject(error);
                }
            );
            return deferred.promise;

        }
    }
})

这很好用，似乎返回了我需要的信息。但是我的问题是在我的.run 块内，我有以下代码：

// Intercept state changes to see if we need to log in
$rootScope.$on('$stateChangeStart', function (event, toState,   toParams
                                                   , fromState, fromParams) {

    console.log(arguments);

    var requireLogin = toState.data.doesRequireLogin;
    console.log(toState.data.principalRoles);

    try {
        // this only works because i assign this in the state, 
        // probably not the best idea, 
        // and besides it only works *after* the first page load, never initially
        console.log($rootScope.user.roles);
    }
    catch(e) {}

    if (requireLogin && !$rootScope.isAuthenticated) {
        event.preventDefault();
        $state.go('auth')
    }

});

这仅适用于初始页面加载后的后续状态更改，你能想到我如何返回所有实例的当前用户角色吗？

【问题讨论】：

请注意，这个答案可以告诉你，如何使用服务作为身份验证信息的持有者：stackoverflow.com/a/26702638/1679310
这看起来可以解决我的问题，如果我尝试过会报告:-)
这个工作，有点摆弄 - 谢谢 Radim :)
很高兴看到这一点，先生。享受强大的 UI-Router ;)

标签： angularjs angular-ui-router

【解决方案1】：

我按照 Radim 在以下问题中的回答解决了这个问题： https://stackoverflow.com/a/26702638/1679310

【讨论】：