承諾，$ mdDialog和操作順序

Question

我有一個角度的應用程序與一個登錄頁面應該顯示加載對話框，而請求正在處理。如果登錄在後端成功，我就沒有問題了，然後我馬上離開內容頁面。不幸的是，如果登錄失敗，加載對話框不會被隱藏。

這裏是我的代碼的結構：我想知道如果我也許誤解的承諾是如何工作的或可能存在於內部的東西

login failed 
hide 
dialog created 

：

app.controller('loginController', [ 
    '$scope', 
    '$http', 
    '$mdDialog', 
    function($scope, $http, $mdDialog) { 
    var showLoading = function(message) { 
     $mdDialog.show({ 
     templateUrl: '../views/loading.html', 
     controller: function($scope) { 
      console.log('dialog created'); 
      $scope.message = message; 
     } 
     }); 
    }; 

    $scope.credentials = { 
     username: '', 
     password: '' 
    }; 

    $scope.handleLogin = function() { 
     showLoading('Logging in...'); 
     $http.post('/login', $scope.credentials).then(function success() { 
     // go to content page 
     }, function error(response) { 
     console.log('login failed'); 
     }).then(function() { 
     console.log('hide'); 
     $mdDialog.hide(); 
     }); 
    }; 
    } 
]); 

在我的輸出我看到正在處理某種超時的$mdDialog服務。

Answer 1

正如你在輸出看到的只是登錄失敗後創建的對話框。儘量讓http請求「秀」行動結束後：

app.controller('loginController', [ 
'$scope', 
'$http', 
'$mdDialog', 
function($scope, $http, $mdDialog) { 
    var showLoading = function(message, onShown) { 
     $mdDialog.show({ 
      templateUrl: '../views/loading.html', 
      controller: function($scope) { 
       console.log('dialog created'); 
       $scope.message = message; 
      }, 
      onComplete:onShown 
     }); 
    }; 

    $scope.credentials = { 
     username: '', 
     password: '' 
    }; 

    $scope.handleLogin = function() { 
     showLoading('Logging in...', function(){ 
      $http.post('/login', $scope.credentials).then(function success() { 
       // go to content page 
      }, function error(response) { 
       console.log('login failed'); 
      }).finally(function() { 
       console.log('hide'); 
       $mdDialog.hide(); 
      }); 
     }); 
    }; 
} 
]); 

Answer 2

在當時的方法，你可以把三個功能。

你必須把你的「$ mdDialog.hide（）;」在第二個功能中，不是第三個功能。 第三個函數僅在您發起長時間請求時使用，並且您希望指示請求的進度百分比。

像這樣的東西必須努力：

$http.post('/login', $scope.credentials).then(function success() { 
     // go to content page 
     }, function error(response) { 
     console.log('login failed'); 
     $mdDialog.hide(); 
     });