javascript - 经过身份验证的用户的 Angular ui 路由，即使初始化为 false，变量也显示未定义

Question

我正在根据这篇文章对我的路由进行建模:angular ui-router login authentication .

我正在制作一个 cordova phonegap 应用程序。我是 angularjs 的新手，这是一种全新的学习体验，所以我非常感谢任何建议!如果我构建的身份验证路由有误，请告诉我。

我有 2 个工厂和一个运行方法。我的第一个工厂名为“principal”，最重要的变量是 isFBLoggedIn。它还具有 3 个函数的返回值，其中 2 个是初始化器，一个初始化 quickblox和一个初始化 facebook。第三个函数只是解析并返回 promise 。

第二个工厂名为“授权”，实际上只是根据变量 isFBLoggedIn 是否为真进行重定向。它在我的名为“应用程序”的状态中得到解决，这是一个抽象的父状态。 (它有一个菜单模板和菜单 Controller ，但不确定这是否重要)。

run 方法只是设置toState 和toStateParams，然后还根据isFBLoggedIn 进行路由。我不确定我是否需要在这里放置路线，但我认为我这样做了，因为我相信工厂只运行一次......

所以我的变量 isFBLoggedIn 未定义，我不知道为什么。我已经在我的代码中初始化了它...

我尝试从该链接复制尽可能多的代码，因为我对 angularjs ui 不是很熟悉。但是，如果您认为有更好的方法可以让我进行身份验证，请告诉我。我希望第一次而不是第 10 次就把事情做好...

我坐着/看这个太久了，所以我希望能得到一些帮助...我做错了什么？

编辑添加:除了显示未定义的isFBLoggedIn 变量外，当我在浏览器中键入需要登录的页面的 url 时，我在浏览器更改为 /login (这是我想要/期望的)。然而，实际 View 并没有改变。我遇到了这个 link这似乎是同样的问题。但是我不明白他们说的是什么问题...

运行方法

.run(['$rootScope','$state','$stateParams','principal','authorization',function($rootScope,$state,$stateParams,principal,authorization){

    $rootScope.$on('$stateChangeStart',function(event,toState,toParams,fromState,fromParams){
      $rootScope.toState = toState;
      $rootScope.toStateParams = toParams;

      // if logged in and going to login page, redirect to cards page
      if (principal.isFBLoggedIn && toState.name === 'app.login'){
        $state.go('app.cards');
      } else if (!principal.isFBLoggedIn && toState.name != 'app.login') {
        // not logged in and not going to login page, redirect to login page.
        $state.go('app.login');
      } else {
           // this is theoretically all fine but that's not true 
           // because things are being routed here because isFBLoggedIn is showing undefined.
      }

    });
  }])

主要工厂

  .factory('principal',['$q','$timeout',function($q,$timeout){
    isFBLoggedIn = false;
    return {
      QBInit: function(){
        QB.init(CONFIG.application_id, CONFIG.authKey, CONFIG.authSecret, CONFIG.debug);
        QB.createSession(function(err, result) {
          if (err){
            return $q.reject("QB Create Session Error");
          } else {
            return result.token;
          }
        });
      },
      FBInit: function(){

        if (!window.cordova) {
          // first check if fb is defined and run browser init and get login status if successful
          checkFBDefined(function(){
            facebookConnectPlugin.browserInit(1506810102869030,"v2.0");
            facebookConnectPlugin.getLoginStatus(
              function(res){
                if (typeof(res) != 'undefined' && res.status === 'connected'){
                  this.isFBLoggedIn = true;
                }
                return res;
              },
              function(err){return $q.reject('getLoginStatus Error: ' + err);
            });
          },0,$timeout);

        } else {
            facebookConnectPlugin.getLoginStatus(
              function(res){
                if (typeof(res) != 'undefined' && res.status === 'connected'){
                  this.isFBLoggedIn = true;
                }
                return res;
              },
              function(err){return $q.reject('getLoginStatus Error: ' + err);
            });
        }
      },
      initialization: function(){
        var deferred = $q.defer();
        var promise = deferred.promise.then(this.QBInit).then(this.FBInit);
        deferred.resolve();
        return promise;
      }
    }
  }])

授权工厂

  .factory('authorization',['$rootScope','$state','principal',function($rootScope,$state,principal){
    return {
      authorize: function(){
        return principal.initialization().then(function(){
          if (principal.isFBLoggedIn && $rootScope.toState.name == 'app.login'){
            // logged in, but going to login page, redirect to cards page
            $state.go('app.cards');
          } else if (!principal.isFBLoggedIn && $rootScope.toState.name !='app.login'){
            // not logged in and not going to login page, redirect to login page.
            $rootScope.returnToState = $rootScope.toState;
            $rootScope.returnToStateParams = $rootScope.toStateParams;
            $state.go('app.login');
          } else {
            console.log("routes should be fine but isn't because isFBLoggedIn is undefined");
          }   

        });
      }
    }
  }])

解析授权工厂的地方:

.config(function($stateProvider, $urlRouterProvider) {
    $stateProvider

      .state('app', {
        url: "/app",
        abstract: true,
        templateUrl: "templates/menu.html",
        resolve:{authorize: ['authorization',function(authorization){
            return authorization.authorize();
            }]
        },
        controller: 'MenuCtrl'
      })

Answer 1

你初始化 isFBLoggedIn = false;作为全局变量，它不绑定(bind)到工厂 principal你注入(inject) app.run .

试试这个:

.factory('principal',['$q','$timeout',function($q,$timeout){
  var isFBLoggedIn = false;
  return {
    isFBLoggedIn: isFBLoggedIn,
    QBInit: function(){ // rest of code