Angular Service / Controller没有回复承诺?

时间:2015-09-06 20:45:34

标签: javascript angularjs promise angular-promise angularjs-http

所以我终于让我的应用程序工作到它获得JSON请求的正确URL。但是现在我无法使用该URL。

我知道该服务正在从Google Maps API返回承诺,我可能不应该这样做,但如果我将其删除,我会得到一个" Weather.getWeather未定义"错误。我不知道为什么。

如何让它正常工作。谢谢你的帮助。

weatherService.getWeather = function(city)  {


        var coordsUrl = 'https://maps.googleapis.com/maps/api/geocode/json?address=' + city;


        return $http.get(coordsUrl)
            .success(function(data) {
                var coords = data.results[0].geometry.location.lat + ',' + data.results[0].geometry.location.lng;

            return getWeatherData(coords);  

        }); 

function getWeatherData(coords)  {
            var deferred = $q.defer(),
            apiKey = 'cbbdddc644184a1d20ffc4a0e439650d',
            weatherUrl = 'https://api.forecast.io/forecast/' + apiKey + '/' + coords + '?callback=JSON_CALLBACK';


            $http.jsonp(weatherUrl)
                .success(function(data) {

                    deferred.resolve(data);

                }).error(function(err) {

                    deferred.reject(err);

                });

            console.log(weatherUrl);

            return deferred.promise;
        }        

    };

控制器:

vm.fetchWeather = function(city) {

    Weather.getWeather(city)
        .then(function(data) {
            console.log(data);
            vm.place = data;
    });
};

1 个答案:

答案 0 :(得分:5)

您不应在.success服务功能中使用getWeather,但不允许您返回任何类型的data。因为回调函数无法返回任何内容Read Here about callback & promise。所以你应该去处理异步请求的promise配方,基本上你可以将promise函数中的数据返回到调用该函数的consumer函数。实际上,当ajax完成时,它会调用消费者.then函数。

您只需在.then函数中使用getWeather函数,然后在解析该异步调用时它将调用getWeatherData函数,该函数将再次返回一个承诺。因此,当它被解析时,它会在getWeatherData返回数据时调用。Weather.getWeather(city)的函数,此时.then .then函数将被调用。这一切都只是你在诺言链中实现的。一个函数等待其他函数,一旦基础承诺得到解决,它就会调用它的return $http.get(coordsUrl) .then(function(resp) { var data = resp.data var coords = data.results[0].geometry.location.lat + ',' + data.results[0].geometry.location.lng; return getWeatherData(coords); }); 函数。

Read here about Promise

<强>代码

getWeatherData

此外,无需在$http函数内创建额外的承诺,因为您可以利用function getWeatherData(coords) { var apiKey = 'cbbdddc644184a1d20ffc4a0e439650d', weatherUrl = 'https://api.forecast.io/forecast/' + apiKey + '/' + coords + '?callback=JSON_CALLBACK'; return $http.jsonp(weatherUrl) .then(function(resp) { var data = resp.data; //you could play with data here before returning it. return data; },function(error) { return error; }); } 调用那里的承诺。

<强>代码

getWeatherData()

Roamer-1888编辑

或者,修改data以接受coords并为自己计算return $http.get(coordsUrl).then(getWeatherData);。然后,流控制语句将简化为weatherService.getWeather = function(city) { var coordsUrl = 'https://maps.googleapis.com/maps/api/geocode/json?address=' + city; function getWeatherData(data) { var apiKey = 'cbbdddc644184a1d20ffc4a0e439650d', coords = data.results[0].geometry.location.lat + ',' + data.results[0].geometry.location.lng, weatherUrl = 'https://api.forecast.io/forecast/' + apiKey + '/' + coords + '?callback=JSON_CALLBACK'; return $http.jsonp(weatherUrl); } return $http.get(coordsUrl).then(getWeatherData); };

rails runner -e production script.rb