在 Angular 中同时使用 Promise 和 service答案

【问题标题】：Use Promise and service together in Angular在 Angular 中同时使用 Promise 和 service
【发布时间】：2015-04-03 02:26:38
【问题描述】：

我的问题基于 Angular Google 组中的this topic。
我想提供一个服务来存储通过 $http 从后端检索到的一些基本数据，然后我只需要获取这些数据一次。喜欢，

var load = function() {
   return $http.get(...).then(function(data) {
       return data.user; 
   });
};

module.factory("userProvider", function() {
    var user;
    var getUser = function() {
        if(!user) {
            load().then(function(data) {
               user = data;
           });
        }
        return user;
    };
    return {
        getUser : getUser
    }
});

module.controller("UserController", ["userProvider", function UserController("userProvider") {
    var user = userProvider.getUser();
    // do something with user
}]);

问题是promise链结束于userProvider而不是控制器，所以我第一次使用这个控制器时用户是未定义的，因为数据还没有返回。

如何使用这样的存储服务并正确返回数据？谢谢！

【问题讨论】：

标签： http angularjs

【解决方案1】：

您可以创建自己的承诺。这是修改后的代码：

module.factory( "userProvider", function( $q ) {
  // A place to hold the user so we only need fetch it once.
  var user;

  function getUser() {
    // If we've already cached it, return that one.
    // But return a promise version so it's consistent across invocations
    if ( angular.isDefined( user ) ) return $q.when( user );

    // Otherwise, let's get it the first time and save it for later.
    return whateverFunctionGetsTheUserTheFirstTime()
    .then( function( data ) {
      user = data;
      return user;
    });
  };

  // The public API
  return {
    getUser: getUser()
  };
});

更新：@yohairosen 下面的解决方案在许多情况下都是一个很好的解决方案，但并非适用于所有情况。在某些情况下，我们只想缓存成功结果，就像我在这里所做的那样。例如，如果此请求的失败表明用户需要先登录，我们不希望下一次调用（可能是在登录之后）传递缓存的失败。如果方法不一定在所有情况下都与调用保持一致，则此方法更好；在所有其他情况下，@yohairosen 的解决方案更简单，值得推荐。

【讨论】：

效果很好。唯一可能缺少的是在第一次调用获取数据时防止额外的外部调用。

【解决方案2】：

创建自己的 Promise 有点开销，Angular 的 $http 无论如何都会为你创建一个。您正在寻找的是缓存，http 可以通过将 cache:true 传递给服务调用来为您处理它。

所以你可以简单地做这样的事情：

 module.factory("userProvider", function() {
   var getUser = function() {
   return $http.get(..., {cache:true}).then(function(data) {
       return data.user; 
   });

   return {
       getUser : getUser
   }
});

【讨论】：