使用带有回调的angularjs JSONP无法定义

时间:2013-10-15 06:58:51

标签: javascript angularjs jsonp

我正在尝试使用Angularjs从USGS Earthquake饲料中收集数据。通常,您需要将?callback = JSON_CALLBACK添加到Angular的URL末尾以使用它,但是USGS提要不会识别此选项。

我正在使用的URL是http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_day.geojsonp并且添加?callback = JSON_CALLBACK(例如http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_day.geojsonp?callback=JSON_CALLBACK)会返回一个包含在名为eqfeed_callback的函数中的数据集。

有没有办法使用这些数据?我有一个eqfeed_callback函数,但它不在范围内,这使得使用Angular毫无意义。

这是我现有的代码:

function QuakeCtrl($scope, $http) {

    $scope.get_quakes = function() {
        var url = 'http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_day.geojsonp';
        $http.jsonp(url)
    }

}

function eqfeed_callback(data) {
    return data;
}

有没有办法让数据重新进入范围,或者获取角度以在内部使用eqfeed_callback函数?

3 个答案:

答案 0 :(得分:18)

另一种选择是在范围内定义eqfeed_callback,如下所示:

function QuakeCtrl($scope, $http) {
    $scope.data = null;
    $scope.get_quakes = function() {
      var url = 'http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_day.geojsonp';
      $http.jsonp(url)
    }

    window.eqfeed_callback = function(data) {
      $scope.data = data
    }
}

答案 1 :(得分:0)

想到的唯一想法是(blech)使用全局,然后手动触发Angular更新,例如:

var callback$scope;
function QuakeCtrl($scope, $http) {

    $scope.get_quakes = function() {
        var url = 'http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_day.geojsonp';
        callback$scope = $scope;
        $http.jsonp(url)
    }

}

function eqfeed_callback(data) {
    if (callback$scope) {
        // 1. Use callback$scope here
        // 2. Set callback$scope to undefined or null
        // 3. Trigger an Angular update (since it won't be automatic)
    }
}

不漂亮,但是......

答案 2 :(得分:0)

扩展@ MichaelVanRijn的回答:

为了保持“全球和平”,在需要时定义全局功能并在之后立即取消它。

.controller('QuakeCtrl', function($window, $scope, $http) {
  $scope.get_quakes = function() {
    $window.eqfeed_callback = function(data){
      console.log("quake data", data)
    };

    // load your jsonp data
    $http.jsonp('http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_day.geojsonp')
    .then(function(success) {
      console.log(success);
      $window.eqfeed_callback = null;
    }, function(fail) {
      console.log(fail);
      $window.eqfeed_callback = null;
    })
  }
})