iterating inside a $http.get

问题

I've this block of code which displays 20 items per request.

.controller('ActorController',function($scope,$http) {

    $scope.getActors = function () {
        var actors = $http.get(https://api.themoviedb.org/3/person/popular&page=1);
        actors.then(
            function (response) {
                $scope.actors = response.data.results;
            }             
        );
    }
})

Instead of page=1, if i put page=2, I'll get another set of 20 items and so on. How to iterate inside the $http.get if I want more than 1 get request in a single page? I want to display the 2nd 20 items after displaying the 1st 20.

回答1:

So you're saying that you want to make multiple calls to $http.get in a loop? If so you'd do something like this:

.controller('ActorController',function($scope,$http) {

    $scope.getActors = function () {
        for(var i = 0; i < 5; i++) {
            getPage(i);
        }
    }

    function getPage(i) {
       var actors = $http.get('https://api.themoviedb.org/3/person/popular&page=' + i);
       actors.then(function (response) {
           for(var j = 0; j < response.data.results.length; j++) {
               $scope.actors.push(response.data.results[j]);
           }
       });
    }
})

That will put the data for the first 5 pages into the $scope.actors array.

回答2:

you can use $q.all to send multiple http requests at once

var fulAr = [];
for (var i = 1; i <= 2; i++) {
    fulAr.push($http.get("https://api.themoviedb.org/3/person/popular&page=" + i))
}
$q.all(fulAr).then(function(response) {
    console.log(response[0].data) //page 1 content
    console.log(response[1].data) //page 2 content

    for(var j = 0; j < response.length; j++) {
       $scope.actors = $scope.actors.concat(response[j].data.results); 
    }
})

Make sure to inject $q to controller

来源：https://stackoverflow.com/questions/43132269/iterating-inside-a-http-get