AngularJS嵌套$ HTTP调用 [英] AngularJS nesting $http calls
问题描述
我想写一个工厂,两个来源获取数据,并使用一个源扩大在其他对象中的数据。
I'm trying to write a factory that gets data from two sources and uses one source to expand the data in the other object.
app.factory('information', ['$http', '$q', 'players', 'matches', function($http, $q, players, matches) {
return {
// Returns all matches and players including extra parsing
get: function() {
return players.get().success(function(data) {
players = data;
matches.get().success(function(data) {
matches = data;
for ( match in matches ) {
matches[match].a_player1 = players.filter(function(player) { return player.username == matches[match].a_player1 })[0];
matches[match].a_player2 = players.filter(function(player) { return player.username == matches[match].a_player2 })[0];
matches[match].b_player1 = players.filter(function(player) { return player.username == matches[match].b_player1 })[0];
matches[match].b_player2 = players.filter(function(player) { return player.username == matches[match].b_player2 })[0];
console.log(matches)
}
return matches;
});
});
},
}
}]);
两者 matches.get()
和 players.get()
简单 GET
请求给一个API,像这样:
Both matches.get()
and players.get()
are simple GET
requests to an API like so:
app.factory('players', function($http) {
return {
get: function() {
return $http({
method: 'GET',
url: '/players',
});
},
}
});
不过,虽然我想它返回上述code(当然)返回玩家
对象匹配
后,它就会用玩家组合对象
对象。
But the above code (of course) returns the players
object while I want it to return the matches
object after it gets combined with the players
object.
这是如何做到这一点任何提示?
Any tips on how to do this?
推荐答案
这功能将不会返回任何事情,因为你不能直接从异步操作返回一个值,要么返回的承诺或使用回调。但我认为就是你要找什么 $ q.all
:
That function won't return anything since you can't directly return a value from an async operation, either return the promise or use a callback. But I think what you're looking for is $q.all
:
return {
// Returns all matches and players including extra parsing
getEverything: function() {
var getPlayers= $http({
method: 'GET',
url: '/players',
});
var getMatches= $http({
method: 'GET',
url: '/matches',
});
return $q.all([getPlayers,getMatches]);
}
}
用法:
getEverything().then(function(data){
var players=data[0].data;
var matches=data[1].data;
})
编辑:
无关,而是移动这个早在工厂:
Irrelevant, but to move this back in the factory:
getEverything: function() {
var getPlayers= $http({
method: 'GET',
url: '/players',
});
var getMatches= $http({
method: 'GET',
url: '/matches',
});
return $q.all([getPlayers,getMatches]);
},
getEverythingMapped:function(){
var deferred = $q.defer();
this.getEverything().then(function(data){
var players=data[0].data;
var matches=data[1].data;
//do as many loops on either result set as you like
for ( match in matches ) {
matches[match].a_player1 = players.filter(function(player) { return player.username == matches[match].a_player1 })[0];
matches[match].a_player2 = players.filter(function(player) { return player.username == matches[match].a_player2 })[0];
matches[match].b_player1 = players.filter(function(player) { return player.username == matches[match].b_player1 })[0];
matches[match].b_player2 = players.filter(function(player) { return player.username == matches[match].b_player2 })[0];
console.log(matches)
//use of a promise here allows us top use this method using -then, we need to so this since we're
//waiting for the result of an async server call before we can loop through players and matches
deferred.resolve(matches);
}
}
}
现在你可以使用这样的上述方法在你的控制器:
Now you would use the above method like this in your controller:
information.getEverythingMapped().then(function(matches){
console.log(matches);
})
这篇关于AngularJS嵌套$ HTTP调用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!