Question

我正在使用Angular 1.5.8和angular-ui-router 0.3.2。我需要在每次路由更改时解析身份验证方法。

我不想为每条路线添加resolve属性，因此我在App.run

中创建了此属性

//check permissions

$rootScope.$on('$stateChangeStart', function (evt, toState) {
    if ($localStorage.token || toState.authenticated) {
        $http.defaults.headers.common = {
            'Authorization': 'Token ' + $localStorage.token,
            'Accept': 'application/json'
        };

        permissionAPI.me()
            .then(function(data){
                $rootScope.user = data;
            })
            .catch(function(){
                if(toState.authenticated) {
                    $rootScope.logout();
                }
            })
    }
    else {
        if(toState.authenticated) {
            $rootScope.logout();
        }
    }
});

`

它通常运行良好，但我注意到很多时候应用程序在promise [{1}}已解决之前进行路由并且稍后会导致错误。

如何确保路线在该承诺之后生效？

或者，如何通过从permissionAPI.me()传递承诺，为我的所有路线制作主resolve？

谢谢！

Answer 1

创建应用状态！如果您需要在整个应用程序中一致地访问数据，但不希望将这些数据与特定视图相关联，则抽象状态非常有用。

    $stateProvider
        .state('app', { 
            url: '/app/',
            template: '<div ui-view></div>',
            controller: 'AppCtrl',
            abstract: true,
            resolve: {
                ActiveUser: function (AuthService) {
                    return AuthService.whoAmI();
                }
            }
        })
        .state('app.home', {
            url: '',
            templateUrl: 'app.home.html',
            controller: 'HomeCtrl',
            resolve: {
                Categories: function (ActiveUser, MessagesService) {
                    return MessagesService.getAll(User);
                }
            }
        });

只要您的控制器处于子级状态app.controller('ExampleCtrl', function (ActiveUser) {});，您就可以在后续解析块或控制器（如'app'）中访问该数据。这是通过命名约定'app.'

实现的

Angular - ui-router在路由之前等待承诺

1 个答案: