Question

在我的控制器中，我有一个在提交表单时调用的createListing（）函数。然后，createListing（）从newListingService服务中调用saveListing（）函数，该服务向数据库发出$ http post请求。然后，我需要更新页面上显示的列表，以使用控制器中的updateListings（）函数包含新创建的列表。我遇到的问题是在createListing（）中的saveListing（）调用之前调用updateListings（）函数。如何确保只在post请求完成后才调用updateListings（）？

控制器：

 ...

  $scope.listings = {};

  $scope.updateListings = function(){
    $http.get('/listings')
       .then(function(res){
          $scope.listings = res.data;
        });
      };

   $scope.createListing = function(listingData){
     newListingService.saveListing(listingData);
     $scope.updateListings();
   };

newListingService：

function newListingService($http){
  this.saveListing = function(listingData){
    $http({
      method  : 'POST',
      url     : '/listings',
      data    : listingData
    })
    .success(function(data) {
    });
  }

}

Answer 1

@depiction是对的。你应该使用promises。

但是，$http会自己回复承诺。因此，您不必使用$q或其他任何内容。只需返回请求，它就会返回promise：

this.saveListing = function(listingData){
   return $http({
            method  : 'POST',
            url     : '/listings',
            data    : listingData
          });
}

并在您的控制器中：

newListingService.saveListing(listingData)
    .then(function(response){
        $scope.updateListings();
    }, function(err){
       // handle error here
    })

Answer 2

你需要使用承诺。

function newListingService($http){
    this.saveListing = function(listingData){

    var deferred = $q.defer();

    $http({
      method  : 'POST',
      url     : '/listings',
      data    : listingData
    })
    .then(
        function success(data) {
            deferred.resolve(data);
        },
        function error(response) {
            deferred.resolve(false);
        }
    );

    return deferred.promise;

  }
}

如何在服务异步调用完成后调用函数？

2 个答案: