javascript - AngularJS — Promise 包含旧信息

Question

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

我目前遇到的一个问题是，如果您输入一个位置，然后输入另一个位置，则延迟的 Promise 具有与上次相同的位置和天气信息(有两个异步调用)。

我把我的项目做了一个Plunker here 。如果您去那里打开控制台，输入两个位置，您会发现这些对象具有相同的信息。

我知道那个 Plunker 上有很多文件；但是，唯一相关的是:MainController.js、getWeatherData.js、setWeatherData.js 和 getLocationData.js .

以下是 getWeatherData 工厂的片段，它从 Forecast.io 获取天气数据并将其作为 Promise 返回(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
     }
  }
}])