AngularJS：使用异步服务运行块+；routeChangeStart以控制身份验证

尝试对某些URL执行带身份验证的角度应用程序

在登录时，无论用户是否具有访问权限，都可以使用登录表单通过http（service LoginServ，login function）获得。如果允许输入，请在localStorage中保存令牌，以便用户以后不必重新输入您的用户名/密码

最初，如果密钥存在于localstore中，则不显示登录表单。如果您继续拥有访问权限或被撤销（LoginServ.LogInToken服务），应通过api http咨询。如果您继续路由到所请求的url，则登录失败

问题在于对服务（1）的调用是异步的。在（3）中运行路由更改（routeChangeStart）时，尚未完成（2），isLoggedIn中的值不正确

少了什么？它是否适合解决方案的样式？谢谢

App.js

.run(function($ionicPlatform, $ionicLoading, $rootScope, Config, LoginServ) {
  $ionicPlatform.ready(function() {
    if (Config.configToken !== "undefined") {
        LoginServ.LogInToken().then(function (json_rta) {
    // => (1) <=
            var acceso      = json_rta.acceso;
            LoginServ.SetLogueo(acceso);
    // => (2) <=
        })
    }

    $rootScope.$on('$routeChangeStart', function (event) {
    // => (3) <=
        if (!LoginServ.isLoggedIn()) {
            event.preventDefault();
            $location.path('/login');
        }
    });         
  });
})
.config(function($stateProvider, $urlRouterProvider, $provide) {
    if (
        localStorage.getItem('rm_t') === "undefined" ||
        localStorage.getItem('rm_t') === null
    ) {
        $provide.value('Config', {
            configToken: "undefined",
            configLogin: false
        })
        localStorage.removeItem('rm_t');
    } else {
        $provide.value('Config', {
            configToken: localStorage.getItem('rm_t'),
            configLogin: true
        })
    }    
  $stateProvider
    .state('login', {
      url: "/login",
      templateUrl: "templates/login.html",
      controller: 'LoginCtrl'
    })

    .state('app.ranking', {
        url: "/ranking",
        views: {
            'menuContent' :{
                templateUrl: "templates/ranking/divisiones.html",
                controller: 'RankingDivisionesCtrl'
            }
        }
    })
  $urlRouterProvider.otherwise('/login');  
});

后勤

.controller('LoginCtrl', function($scope, $ionicLoading, $location, LoginServ) {
    LoginServ.LogOut();

     $scope.submitted = false;      

    $scope.LogIn = function(datosLogin) {
        $scope.submitted = true;

        LoginServ.LogIn(datosLogin).success(function (json_rta) {
            var acceso      = json_rta.acceso;

            if (acceso) {
                localStorage.setItem('rm_t', json_rta.token);
                LoginServ.SetToken(json_rta.token);
                LoginServ.SetLogueo(true);
                $location.path("app/ranking");
            } else {
                $scope.login_error = json_rta.error;
            }

        }).error(function (response){
        });
    };      

});

需要身份验证才能访问的部分（应用程序排名）：

.controller('RankingDivisionesCtrl', function($scope, LoginServ, Config) {
    $scope.$watch(LoginServ.isLoggedIn, function (value, oldValue) {
        if (!value && oldValue) {
            $location.path('/login');
        }

        if (value) {
            //Do something when the user is connected
            $scope.divisiones   = {};
        } else {
            LoginServ.LogOut();
        }
  }, true);
});

---

查看

$stateProvider

的

resolve

属性-这将阻止切换到视图，直到解析了所有解析属性，包括与异步身份验证相关的函数，但我需要在所有路由中添加resolve属性。有什么全球性的吗？路由前预加载数据的步骤相同？您可以为需要身份验证的状态子树创建根状态，并在其中添加

resolve

.controller('RankingDivisionesCtrl', function($scope, LoginServ, Config) {
    $scope.$watch(LoginServ.isLoggedIn, function (value, oldValue) {
        if (!value && oldValue) {
            $location.path('/login');
        }

        if (value) {
            //Do something when the user is connected
            $scope.divisiones   = {};
        } else {
            LoginServ.LogOut();
        }
  }, true);
});