从服务获取异步数据

Question

我尝试在服务中请求一些数据。我想确保数据保存在服务的变量中，因为由于状态变化，我的控制器将一直重新加载，并且我只需要在网站加载时使用一次数据。

  app.service('resultDeals',['$translate','$cookies','$http',
    function($translate,$cookies,$http) {

      var currentOrigin = {};
      var originsUser={};

      return {

        loadOrigins:function() {
          $http.get('app/deals/deal.json').success(function(response){
            console.log(response);
            originsUser = response.data;
            return originsUser
          }).error(function(err){
            console.log(err);
          });
        },
        userOrigin:originsUser

      };

    }]);

我的控制器如下所示

console.log(resultDeals.loadOrigins());
    $scope.updateOrigins=resultDeals.loadOrigins();

问题是 resultDeals.loadOrigins() 总是未定义。

我想确保将从 loadOrigins() 获得的数据存储在服务变量中，并且只在需要时从控制器访问它，这样当控制器重新加载数据时就不必再获取了。

我该怎么做？

Answer 1

当您使用异步代码时，您必须处理承诺。 loadOrigins 必须 returns 一个承诺，并且您的控制器必须使用它。

app.service('resultDeals',['$translate','$cookies','$http', '$q',
function($translate,$cookies,$http,$q) {

  var currentOrigin = {};
  var originsUser={};

  return {

    loadOrigins:function() {
      var deferred = $q.defer();

      $http.get('app/deals/deal.json').success(function(response){
        console.log(response);
        originsUser = response.data;
        deferred.resolve(originUser),
      }).error(function(err){
        console.log(err);
        deferred.reject();
      });

      return deferred.promise;
    },
    userOrigin:originsUser
  };

}]);

// In controller
resultDeals.loadOrigins().success(function(updateOrigins) {
    $scope.updateOrigins = updateOrigins;
}).error(function() {
    console.log('bad !');
});

Answer 2

不要使用 .success 和 .error 回调函数，因为他们没有能力 return 任何东西，因此他们无法继续承诺链。而是在 $http.get 方法（return 是一个 promise 对象）上使用 .then。这将有能力 return data 而 promise 已 resolved 或 reject 一个承诺。您可以从控制器方法继续 promise 链。

服务

return {
    loadOrigins: function() {
        return $http.get('app/deals/deal.json')
          .then(function(response) {
            console.log(response);
            originsUser = response.data;
            return originsUser
          }, function(err) {
            console.log(err);
          });
    },
    userOrigin: originsUser
};

控制器

resultDeals.loadOrigins().then(function(user){
   $scope.updateOrigins= user;
}, function(){
   console.log("Errror occurred.")
})

从服务获取异步数据

Getting asynchronous data from service

asynchronous

angularjs

angular-services

angularjs-http

angular-promise