【问题标题】:Angular: deferred var is undefined in then-methodAngular:延迟变量在 then 方法中未定义
【发布时间】:2015-09-13 08:32:03
【问题描述】:

在我的 Angular.JS 代码中,我使用 GET/JSONP 调用 Yahoo YQL API,我确实得到了响应。但是有两个问题。

  1. 它调用错误方法而不是成功。为什么?
  2. 延迟变量似乎在错误函数中未定义。为什么?

您可以找到JsFiddle here。它基于AJAX example

function DefaultCtrl($log, $scope, $http, myService) {

    var promise = myService.getSuggestions('yahoo');

    promise.then(
          function(payload) { 
              $log.info('receiving data', payload);
              $scope.test = payload;
              $log.info('received data', payload);
          },
          function(errorPayload) {
              $log.error('failure loading suggestions', errorPayload);
          });    
}

angular.module('MyModule', [])
.factory('myService', function ($http, $log, $q) {
    return {
        getSuggestions: function (symbol) {            

            var deferred = $q.defer();

            $http.jsonp("http://d.yimg.com/autoc.finance.yahoo.com/autoc", {
                cache: true,
                params: { 
                    callback: "YAHOO.Finance.SymbolSuggest.ssCallback",               
                    query: symbol
                }
            })
            .success(function(data) {
                deferred.resolve(data);
            })
            .error(function(msg, code) {
                $log.error("error");
                deferred.reject(msg);  // <---- error occurs here!
                $log.error(msg, code);
            });

            var YAHOO = window.YAHOO = {Finance: {SymbolSuggest: {}}};
            YAHOO.Finance.SymbolSuggest.ssCallback = function (data) {
                $log.info("received data", data);
            }; // YAHOO.Finance     

            return deferred.promise;
        }
    }
});

【问题讨论】:

    标签: jquery angularjs jsonp jquery-deferred q


    【解决方案1】:

    这是一个有效的example。您必须在承诺回调中传递回调函数,然后让您的回调拒绝或解决承诺。 我认为您发布的代码的问题在于,在执行回调后,successerror 都被执行,因此未定义的 var 被解析/拒绝。

    var myApp = angular.module('MyModule', []);
    
    myApp.controller('DefaultCtrl', function ($log, $scope, $http, myService) {
    
        var promise = myService.getSuggestions('yahoo');
    
        promise.then(
    
        function (payload) {
            $log.info('receiving data in DefaultCtrl', payload);
            $scope.test = payload;
        },
    
        function (errorPayload) {
            $log.error('failure loading suggestions', errorPayload);
        });
    
    });
    
    
    myApp.factory('myService', function ($http, $log, $q) {
        return {
            getSuggestions: function (symbol) {
    
                var YAHOO = window.YAHOO = {
                    Finance: {
                        SymbolSuggest: {}
                    }
                };
                YAHOO.Finance.SymbolSuggest.ssCallback = function (data) {
                    $log.info("received data in ssCallback", data);
                    deferred.resolve(data);
                }; // YAHOO.Finance     
    
                var deferred = $q.defer();
    
                $http.jsonp("http://d.yimg.com/autoc.finance.yahoo.com/autoc", {
                    cache: true,
                    params: { 
                        callback: "YAHOO.Finance.SymbolSuggest.ssCallback",               
                        query: symbol
                    }
                })
                .then(YAHOO.Finance.SymbolSuggest.ssCallback);
    
                return deferred.promise;
            }
        }
    });
    

    【讨论】:

    • 不错,但对我不起作用。我根据您的更新了my fiddle,但仍然无法正常工作。我正在使用 chrome 并在控制台上看到此错误:$apply 已在进行中。
    • 加载小提琴http而不是https以便工作。问题是您正在从https 请求http 资源。在您提到的错误上方,您一定会看到:Mixed Content: The page at 'https://fiddle.jshell.net/Nagilo/0yhw17g4/show/' was loaded over HTTPS, but requested an insecure script 'http://d.yimg.com/autoc.finance.yahoo.com/autoc?callback=YAHOO.Finance.SymbolSuggest.ssCallback&amp;query=yahoo'. This request has been blocked; the content must be served over HTTPS.。所以切换到http....
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-12-02
    • 1970-01-01
    • 1970-01-01
    • 2016-08-18
    • 2011-09-12
    相关资源
    最近更新 更多