Multiple GET requests in Angularjs

Question

I want to make multiple ajax calls from different urls in football-data.org API. Here's my code sample:

angular.module('liveFootball', ['ionic'])
.constant('urls', {
    BASE: 'http://api.football-data.org/',
    BASE_API: 'http://api.football-data.org/v1/soccerseasons/',
    TEAM_URL: 'http://api.football-data.org/v1/teams',
    HEAD: {
        'X-Auth-Token': 'e7486677a2dd4260b7aeb8a464749e80'
    }
});

        getAllFixtures: function(leagueID){
            var getAllFixtures = {
                method: 'GET',
                url: urls.BASE + "fixtures?timeFrame=n14",
                headers: urls.HEAD
            }
            return $http(getAllFixtures);
        },

Is there a way I can include another url in this call? Thanks.

Your function name `getAllFixtures` and object name `getAllFixtures` in the function are the same? Anyway, do you want them all to return at the same time or you don't care about the order? — kennasoft, May 08 '17 at 21:58
All I want is the possibility to add another url after the fixtures — Aoguzie, May 08 '17 at 22:06
It's not possible to have more than one url. each url has to go with a separate request. — kennasoft, May 08 '17 at 22:21
It is unclear what you are asking. Do you want to traverse the API using the data returned by the first call? Or do you want to execute multiple API calls in parallel? And what do you want to do with the `leagueID` parameter? — georgeawg, May 08 '17 at 23:41

score 2 · Answer 1 · edited May 09 '17 at 01:45

It's not possible to have more than one url field in the $http config object, but you can send the three requests and use ~~Promise.all()~~ $q.all to await their responses. The response will be a promise which when you .then() will have an array containing all the responses.

    getAllFixtures: function(leagueID){
            var sources = [
                 urls.BASE,
                 urls.BASE_API,
                 urls.TEAM_URL
            ];
            var promises = [];
            for(var i=0; i<sources.length; i++){
                promises.push($http({
                    method: 'GET',
                    url: sources[i] + "fixtures?timeFrame=n14",
                    headers: urls.HEAD
                }));
            }
            return  ̶P̶r̶o̶m̶i̶s̶e̶.̶a̶l̶l̶ $q.all(promises);
        }

Be careful when using ES6 promises with the AngularJS framework. ES6 promises can cause problems when their `.then` blocks modify $scope. It is safer to use [AngularJS `$q.all`](https://docs.angularjs.org/api/ng/service/$q#all). — georgeawg, May 08 '17 at 22:58

score 0 · Answer 2 · answered May 08 '17 at 22:12

There is no way you can include another url , you have to call it again. You can use $q.all in angular to make multiple request at once. For example:

    var request = [getAllFixtures('10'), getAllFixtures('11)];
     $q.all(request).then(function (value) {

     },function(err){

     }

Multiple GET requests in Angularjs

2 Answers2