AngularJS如何在某些功能完成後執行功能？

我有一些網頁，其中包含與Facebook的按鈕，我設置隱藏着ng-hide="fbLoggedIn"註冊並形成我設置隱藏着ng-show="fbLoggedIn"AngularJS如何在某些功能完成後執行功能？

輸入我的目標是與Facebook的按鈕會隱藏，如果fbLoggedIn設置爲true，並形成輸入將顯示如果fbLoggedIn設置爲true。

寄存器的Facebook按鈕ng-click="registerFb()"執行此功能

$scope.registerFB = function() { 

     authService.fbLogin(); 
     $scope.fbLoggedIn = authService.fb_logged_in(); 
     console.log($scope.fbLoggedIn); //this show false even `fb_access_token` not null 

    }

這是我authService.fbLogin and authService.fb_logged_in功能

authService.fbLogin = function() { 

     var FB = window.FB; 

     FB.login(function(response) { 
     console.log(response); 

    if (response.authResponse) { 
     sessionService.set('fb_id', response.authResponse.userID); 
     sessionService.set('fb_access_token', response.authResponse.accessToken); 
     sessionService.set('fb_expiration_date', new Date(new Date().getTime() + response.authResponse.expiresIn * 1000).toISOString()); 
    //console.log('Welcome! Fetching your information.... '); 
    FB.api('/me', function(response) { 
     console.log('Good to see you, ' + response.name + '.'); 
     console.log(response); 


    }); 

    } else { 
    console.log('User cancelled login or did not fully authorize.'); 
    //console.log(response); 
    } 
    }); 

}; 

authService.fb_logged_in = function() { 
    if(sessionService.get('fb_access_token') != null){ 
     return true; 
    }else { 
     return false;  
    } 
};

在其他功能我嘗試檢查，如果fb_access_token不爲空，只是爲了確保一些錯誤我的邏輯，結果是true。

有了上面的調試，我可以說$scope.fbLoggedIn = authService.fb_logged_in();在authService.fbLogin();之前完成。

那麼如何在authService.fbLogin();完成後執行$scope.fbLoggedIn = authService.fb_logged_in();？也許如何實現我的目標？

來源

2016-11-20 Dark Cyber

的最佳實踐。作爲回報，在調用defer.resolve（）之後推遲變量，其中defer = $ q。並使用the.then（）方法的第一個參數來完成任務。 –

@TirthrajBarot你想用一些代碼示例來回答嗎？也許用我的代碼？ –

我認爲你也可以使用$ rootScope來完成它...只需在你的登錄函數中設置$ rootScope.fb_isLogin = true並將這個rootScope變量放在ng-hide中 –

好的。這可以通過承諾來實現。我不知道您的autService服務中包含的參數，因此我將使用可能需要添加的新參數創建一個具有相同名稱的工廠。

因此，據我所知，這是你的工廠應該如何。

angular.module('YourModuleName').factory('authService',['$http','$q',function($http,$q){ 

    var obj = {}; 
    obj.fbLogin = function() { 
     var defer = $q.defer(); 
     var FB = window.FB; 
     FB.login(function(response) { 
      console.log(response); 

      if (response.authResponse) { 
       sessionService.set('fb_id', response.authResponse.userID); 
       sessionService.set('fb_access_token', response.authResponse.accessToken); 
       sessionService.set('fb_expiration_date', new Date(new Date().getTime() + response.authResponse.expiresIn * 1000).toISOString()); 
       FB.api('/me', function(response) { 
        console.log(response); 
        defer.resolve('Good to see you, ' + response.name + '.'); 
       }); 

      } 
      else { 
       defer.reject('User cancelled login or did not fully authorize.'); 
      } 
     }); 
     return defer.promise; 
    } 

    obj.fb_logged_in = function() { 
     if(sessionService.get('fb_access_token') != null){ 
      return true; 
     }else { 
      return false;  
     } 
    }; 


    return obj; 

}])

因此，來自控制器的函數調用應該如下。

$scope.registerFB = function() { 
    authService.fbLogin().then(function(response){ 
     $scope.fbLoggedIn = authService.fb_logged_in(); 
     console.log($scope.fbLoggedIn); 

    },function(error){ 
     console.error("Error : ",error); 
    }); 
} 
Note: CODE NOT TESTED.

因此，它會解決這個問題，你可以使用承諾做到這一點的angularJS

來源

2016-11-20 11:31:31

使用$ rootscope來分配它們提供事件發射/廣播和訂閱功能的值。

來源

2016-11-20 11:30:39

AngularJS如何在某些功能完成後執行功能？

回答

相關問題