角度:在初始化控制器之前重新加载$rootscope用户

Angular: Reload $rootscope user before initializing controller

本文关键字：加载 用户 rootscope 新加载 初始化 控制器 角度      更新时间：2023-09-26

我正在使用AngularJS开发SPA。登录后，将使用令牌创建一个 Cookie，并将用户对象存储在$rootScope.user中，当它们动态加载时，可以从各种控制器方便地访问该对象。

当我正常使用它并四处导航时，该应用程序工作正常。

当我使用 F5 刷新页面时，angular 被重新加载，模块 run(( 方法检查 cookie 是否存在并将用户从服务器重新加载到 $rootScope.user 中。但是，当这种情况发生时，另一个控制器已经期望$rootScope.user有一个用户。

如何在$rootScope.user准备就绪并加载之前防止控制器初始化。当然，如果可以的话，请检查控制器中是否有用户加载$rootScope.但是如果没有，$rootScope如何调用控制器来执行一些初始化呢？

下面是 app.run(( 中的代码：

app.run(function ($rootScope, $location, $cookies, appServices) {
    var token = $cookies.get('UserToken');
    if (token) $rootScope.token = token;
    $rootScope.$on("$routeChangeStart", function (event, next, current) {
        // Get user from server if token is there but no user
        if ($rootScope.user == null) {
            if ($rootScope.token) {
                appServices.getUserByToken(token).then(function (d) {
                    if (d.Code == 1) {
                        $rootScope.user = d.ReturnObj;
                        if ($rootScope.user != null && next.templateUrl == "web/views/signin.html") $location.path("/dashboard");
                    } else $rootScope.goSignin(next.templateUrl);
                });
            }
            else $rootScope.goSignin(next.templateUrl);
        }
    });
})

下面是动态加载的控制器中的示例代码：

app.registerCtrl('userdetailCtrl', function userdetailCtrl($scope, $http, $rootScope, $routeParams, appServices, $location, validationService) {
  $scope.getOffices=function()
    {
      appServices.getOffices({ ID: $rootScope.user.OrgID, Token: $rootScope.token }).then(function (d){
      if(d.Code==1){$scope.office = d.ReturnObj;}});
    }
  $scope.getOffices();
});

getOffices()函数需要$rootScope.user.OrgID，因为尚未加载$rootScope.user所以找不到。

有什么想法吗？

不确定这是否适用于您的情况，但是 

$rootScope.$on('$includeContentLoaded', function () {
    //fetch user here
}

解决了我遇到的类似问题

您可以执行以下几件事，以下是其中两件事的示例。检查此小提琴中的控制台

1. 观察变量的变化：

首先是监视控制器$rootScope.user的变化：

应用运行：

$timeout(function() {
    $rootScope.user = 'user';
}, 500)

在控制器中：

$rootScope.$watch('user', function(newVal, oldVal) {
   console.log(newVal, $rootScope.user); 
});

如果您不想在每次用户变量更改时继续执行代码，您也可以"取消监视"。

2. 发出事件

第二种是发出一个事件，并在需要时捕获它，如下所示：

应用运行：

$timeout(function() {
    $rootScope.user = 'user';
    $rootScope.$broadcast('userEvent');
}, 500)

您的控制器：

$rootScope.$on('userEvent', function() {
    console.log($rootScope.user);
});
相关文章：