有自定义回调的Angular Service JSONP请求
我从具有自定义回调函数的JSONP提要中拉取，例如：
jsonpCallbackAllStar2015({
"events": [
{
"title": "XYZ"
}
...
]
})
我能够做到这一点，使用这里发布的解决方案，如下所示：
var jsonUrl = 'http://i.cdn.turner.com/nba/nba/.element/media/2.0/teamsites/warriors/json/json-as2015.js?callback=JSON_CALLBACK' + (new Date().getTime());
$http.jsonp(jsonUrl);
window.jsonpCallbackAllStar2015 = function(data) {
$scope.events = data.events;
}
不过，我现在想在服务中这样做，以便我可以一次加载数据并将其注入到所有控制器中。 然而，当我尝试这样做时，我得到一个$ injector未定义的错误，我猜测这是因为该服务没有足够快地返回：
eventsFactory.$inject = ['$http'];
function eventsFactory($http) {
var jsonUrl = 'http://i.cdn.turner.com/nba/nba/.element/media/2.0/teamsites/warriors/json/json-as2015.js?callback=JSON_CALLBACK' + (new Date().getTime());
$http.jsonp(jsonUrl);
window.jsonpCallbackAllStar2015 = function(data) {
return data.events;
}
}
无论如何要解决这个问题，还是必须在每个控制器中重复jsonp请求？ 这是一个小提琴。
虽然这不是一个漂亮的解决方案，但它应该适合你。 我加入了一些非常基本的缓存。 我没有在角度使用jsonp，并且似乎将$ http配置中的缓存设置不起作用。 这将是一个更好的选择。
app.factory('eventsFactory', [ '$http', '$q',
function( $http, $q ) {
var pub = {};
var jsonUrl = 'http://i.cdn.turner.com/nba/nba/.element/media/2.0/teamsites/warriors/json/json-as2015.js?callback=JSON_CALLBACK' + (new Date().getTime()),
cachedResponse;
pub.getEvent = function() {
var deferred = $q.defer();
if ( cachedResponse ) {
deferred.resolve( cachedResponse );
}
else {
$http.jsonp( jsonUrl );
window.jsonpCallbackAllStar2015 = function( data ) {
cachedResponse = data;
deferred.resolve( data );
}
}
return deferred.promise;
};
return pub;
}
]);
现在在你的控制器里面，你可以这样做：
app.controller('someController', [ 'eventsFactory',
function( eventsFactory) {
eventsFactory.getEvent().then(function( data ) {
console.log( data );
});
}
]);