javascript - 编写惰性 ajax 服务的最佳实践

Question

在 angular-js 中编写惰性 ajax 服务的最佳实践是什么？例如，我想创建出于某种原因应该返回这样的 promise 的资源:

angular.module('MyModule',[])
  .factory('myService', function() {
    return {
      getData: function() {
          return $http.get('http://host/api/data');
      }
    }
  });

而且我只想加载此数据一次，那么实现它的最佳方法是什么？我只有一个想法，它真的很难看:

angular.module('MyModule', [])
.factory('myService', function($q) {
    var dataResponse = null;
    return {
        getData: function() {
            if (dataResponse) {
                var def = $q.defer();
                def.resolve(dataResponse);
                return def.promise;
            }
            return $http.get('http://host/api/data');
        },
        setDataResponse: function(response) {
            dataResponse = response;
        }
    }
})
.controller('MyCtrl', function($scope, myService) {
    myService.getData().then(function(response) {
        myService.setDataResponse(response);
        $scope.data = response.data
    })
});

我不喜欢这部分:

var def = $q.defer();
def.resolve(dataResponse);
return def.promise;

而且我不喜欢每次调用 getter 时都必须编写 response setter 的事实，但我真的不知道如何使这段代码更好。

Answer 1

您可以稍微清理一下内存逻辑。

angular.module('MyModule', [])
.factory('myService', function($q) {
    var dataResponse = null;
    return {
        getData: function() {
            if (dataResponse) {
                return $q.when(dataResponse); // or $q.resolve for angular 1.4+
            }
            return $http.get('http://host/api/data').then(function(data) {
              dataResponse = data;
              return data;
            });
        },
    }
})
.controller('MyCtrl', function($scope, myService) {
    // use as normal. No need to write back
    myService.getData().then(function(response) {
        $scope.data = response.data
    })
});