設置超時持續時間等於登錄進程運行所花費的時間

我試圖在用戶登錄時在屏幕外創建一個登錄表單。動畫取決於if語句，該語句檢查當前認證狀態。然而，爲了使這個聲明起作用，我不得不設置$timeout，以便在運行if語句之前發送登錄請求並更改身份驗證狀態。設置超時持續時間等於登錄進程運行所花費的時間

只要請求不會超過1000 ms（並且這也是最低限度，它必須設置爲），這可以正常工作，但有時會花費更長時間。所以我的問題是，如何讓這個持續時間根據請求運行所花費的時間而改變？我不想設置例如3000 ms並讓用戶等待，如果請求本身只需要1000 ms就不需要。

登錄過程是使用Firebase完成的，因此它必須向其API發送請求，然後發回響應，這就是持續時間非常不一致的原因。

我從一個通過兩個獨立按鈕激活的指令運行這個動畫;一個顯示的實際形式和一個確認信息，用戶已經進入：

forumApp.directive('mySigninSlide', ['sharedInfo', '$timeout', 
    function(sharedInfo, $timeout) { 
     return { 
      restrict: 'A', 
      link: function($scope, element, attrs) { 

       /** 
       * Display/hide the login form via 
       * an animation depending on which 
       * button is clicked and the login state 
       */ 
       element.on('click', function() { 

        var sidebar = $('#signin-wrapper'); 

        if (element.attr('id') === 'confirm-login-btn') { 

         $timeout(function() { 

          if (sharedInfo.getAuthState()) { 

           sidebar.stop().animate({left: '-606px'}); 
           sharedInfo.setError(''); 
           $scope.isAnimated = true; 
          } 
         //1000 ms is the bare minimum time 
         //it takes for the login process 
         }, 1000); 
        } 
        else { 
         if ($scope.isAnimated === undefined || 
          $scope.isAnimated === false) { 

          sidebar.stop().animate({left: '340px'}); 
          $scope.isAnimated = true; 
         } 
         else { 
          sidebar.stop().animate({left: '-606px'}); 
          $scope.isAnimated = false; 
          sharedInfo.setError(''); 
         } 
        } 
       }); 
      } 
     }; 
}]);

來源

2015-02-23 Chrillewoodz

您的登錄名應該是ajax調用，而不是您應該在回調函數中檢查auth-state。您現在嘗試做的方式將無法正常工作。 – skobaljic 2015-02-23 10:29:35

@skobaljic然後我怎樣從回調中調用指令？因爲登錄過程目前是AJAX調用。身份驗證狀態存儲在服務中，以便我可以在控制器之間共享。 – Chrillewoodz 2015-02-23 10:32:58

我會說：'send_login_data（url，data，callback：check_auth_state（url，data，callback：function（do_animations（）））'所有東西都必須流異步 – skobaljic 2015-02-23 10:43:28

一個解決辦法是迅速檢查AUTH狀態（而不是一個呼叫$timeout）這樣說：

function checkState() { 
    maxChecks--; 
    if (sharedInfo.getAuthState()) { 
     sidebar.stop().animate({left: '-606px'}); 
     sharedInfo.setError(''); 
     $scope.isAnimated = true; 
    } else if (maxChecks) setTimeout(checkState, 100); 
}; 
var maxChecks = 30; 
setTimeout(checkState, 500);

這意味着：等待一秒鐘然後檢查新的 auth-state每個.1秒。

我不得不這樣做幾次，但我沒有它的樂趣。我建議你找到不同步的方式 - 它應該完成的方式。

來源

2015-02-23 11:08:44 skobaljic

設置超時持續時間等於登錄進程運行所花費的時間

回答

相關問題