在AngularJS服务中缓存promise对象

Question

我想使用Promises在AngularJS中实现动态加载静态资源.问题:我在页面上有几个组件可能(或不是,取决于哪些显示,因此是动态的)需要从服务器获取静态资源.加载后,可以在整个应用程序生命周期内进行缓存.

我已经实现了这个机制,但我是Angular和Promises的新手,我想确保这是一个正确的解决方案\方法.

var data = null;
var deferredLoadData = null;

function loadDataPromise() {
  if (deferredLoadData !== null)
    return deferredLoadData.promise;

  deferredLoadData = $q.defer();

  $http.get("data.json").then(function (res) {
    data = res.data;
    return deferredLoadData.resolve();
  }, function (res) {
    return deferredLoadData.reject();
  });

  return deferredLoadData.promise;
}

因此,只发出一个请求,并且对loadDataPromise()的所有下一次调用都会获得第一个承诺.它似乎适用于进展中的请求或前一段时间已经完成的请求.

但缓存Promises是一个很好的解决方案吗？

Answer 1

这是正确的方法吗？

是.对返回的函数使用memoisation提供了一种通用技术,可以避免重复执行异步(通常是昂贵的)任务.承诺使缓存变得容易,因为不需要区分正在进行的操作和已完成的操作,它们都表示为(相同的)结果值的承诺.

这是正确的解决方案吗？

不是.全球data变量和解决方案undefined不是承诺的工作方式.相反,履行结果的承诺data!它还使编码更容易:

var dataPromise = null;

function getData() {
    if (dataPromise == null)
        dataPromise = $http.get("data.json").then(function (res) {
           return res.data;
        });
    return dataPromise;
}

然后,而不是loadDataPromise().then(function() { /* use global */ data })简单getData().then(function(data) { … }).

为了进一步改进模式,您可能希望隐藏dataPromise在闭包范围中,并注意在getData获取参数(如url)时需要查找不同的promise .