Question

这是我的第一个Angular项目，我正在构建一个天气应用程序，用于从用户在输入字段中输入的特定位置获取天气数据。

我目前遇到的一个问题是，如果您输入某个位置，然后输入另一个，延迟承诺与最后一个具有相同的位置和天气信息（有两个异步调用）。

我制作了我的项目here的Plunker。如果你去那里打开你的控制台，输入两个位置，你会注意到这些对象有相同的信息。

我知道Plunker上有很多文件;但是，唯一相关的是：MainController.js，getWeatherData.js，setWeatherData.js和getLocationData.js。

这是getWeatherData工厂的一个片段，它从forecast.io获取天气数据并将其作为承诺返回（getLocationData非常相似）：

(function(){
    angular.module("factories")
        .factory("getWeatherData", ["$http", "$q",  function($http, $q){
            var deferred = $q.defer();
            var factory = {
                getData : function(coordinates){
                    $http.jsonp
                    (
                        "https://api.forecast.io/forecast/e1ab2c9f6b96acf85206c6def727a48e/" + coordinates + "?callback=JSON_CALLBACK"
                    )
                    .then(
                        function(response){
                            deferred.resolve(response);
                        }
                    );
                },
                promise : function(){
                    return deferred.promise;
                }
            };
            return {
                factory : factory
            };
        }]);
})();

Answer 1

应该以这种方式使用工厂：

.factory("getWeatherData", ["$http", "$q",  function($http, $q){
  var deferred = $q.defer();
  return {
     getData : function(coordinates) {
        $http.jsonp(
            "https://api.forecast.io/forecast/e1ab2c9f6b96acf85206c6def727a48e/" + coordinates + "?callback=JSON_CALLBACK"
        ).then(function (response) {
                deferred.resolve(response);
        })
     return deferred.promise
     }
  }
}])

Answer 2

所以，问题在于我是如何建造工厂的。另外，正如@ ste2425在上面的评论中指出的那样，$http会返回一个承诺。话虽如此，在处理http请求时没有理由$q ......这只是一种冗余。我研究了工厂并找到了this。

制作工厂时......

由于对象引用的绑定和更新方式
，始终返回主机对象而不是显示的模块模式

这是我的新getWeatherData工厂！我也用同样的模式更新了所有其他的。

(function(){
angular.module("factories")
    .factory("getWeatherData", ["$http", function($http){
        var getWeatherData = {};
        getWeatherData.getData = function(coordinates){
            return $http.jsonp("https://api.forecast.io/forecast/e1ab2c9f6b96acf85206c6def727a48e/" + coordinates + "?callback=JSON_CALLBACK");
        };
        return getWeatherData;
    }]);
})();

AngularJS - Promises有旧信息

2 个答案: