Javascript AngularJS |刷新浏览器时，AngularJS模板在安全上下文之前加载。如何阻止它？

在我的angularjs应用程序（使用AngularUI）中，在刷新浏览器时，在从服务器获取安全上下文之前，将加载特定状态的模板。 正在命中用于获取安全上下文的$http调用，但由于它是异步的，因此尚未设置它们

解决这个问题的最好办法是什么

此外，我一直在努力做到以下几点：

//on the state change event from refresh

$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams){
    console.log("state change has started");
    if(fromState.name === '' && fromState.url === '^'){
        console.log("inside state change from refresh");
        //what needs to be done in this block to let the security context is fetched (should I use $timeout etc.) ?
           .........
           .........
    }
});

做

在你的if区块内。它将停止状态更改。然后在安全检查之后，你可以这样做

$state.go(toState, toParams);

---

但这是错误的方式。正如@Radim所建议的，您必须使用resolve。

我们使用以下两个代码片段来解决这个问题。在我们来到这里之前，我们尝试了其他一些方法。这一个看起来很健壮

在用户服务工厂中：

     // setup UserService OBject
    ...
    // bootstrap the Service 
    var tokenRetrieved = $location.search().token || localStorageService.get(AUTH_COOKIE_NAME);

    if (tokenRetrieved) {
                UserService.login(tokenRetrieved, true)
                    .then(function success(user) {
                        UserService.initialized = true;
                    }, function error(err) {
                        localStorageService.remove(AUTH_COOKIE_NAME);
                        UserService.initialized = true;
                    });
    } else {
          UserService.initialized = true;
    }

    return UserService;

在$stateChangeStart处理程序中：

            if (UserService.initialized) {
                // here we check authorization for the toState
                ....


            } else {
                // if the UserService is not done initializing we cancel the stateChange and schedule it again in 200ms
                event.preventDefault();
                $rootScope.$log.log('preventing state change, because UserService not ready to check Authorization');
                $timeout(function () {
                    $state.go(toState, toParams);
                }, 200);
            }

---

请注意，为了安全起见，我确实使用根状态及其解析来加载所有数据。。可以在这里找到起草的示例是的，我之前已经尝试过了，但是我的应用程序在大小上增长了一点，并且没有一个“根”状态。我知道这听起来有点荒谬，但就是不能应用这种方法，因为如果我必须在状态中注入resolve对象，我将不得不在很多地方这样做。我想这是最好的方法，但遗憾的是我不能使用它。非常感谢，非常感谢。还有别的办法吗？

            if (UserService.initialized) {
                // here we check authorization for the toState
                ....


            } else {
                // if the UserService is not done initializing we cancel the stateChange and schedule it again in 200ms
                event.preventDefault();
                $rootScope.$log.log('preventing state change, because UserService not ready to check Authorization');
                $timeout(function () {
                    $state.go(toState, toParams);
                }, 200);
            }