Angular http GET looping using new URL in response

Question

I am fetching data using the REST API of SharePoint 2010 which has a maximum list item limit of 1000. When fetching a list with greater than 1000 items the response data will have a key called d.__next that contains the URL for the next set of results. For example:

https://{SiteURL}}/_vti_bin/listdata.svc/{listName}/?$skiptoken=1000

I had initially assumed that there would be always less than about 3000 items in the list so I just nested the requests a few times like in this example:

    $http({
    method: 'GET',
    url: jsonLocation,
    headers: {
        "Accept": "application/json;odata=verbose"
    }
}).then(function successCallback(
        response) {
        // console.log(response.data.d)
          $scope.ListData = response.data.d.results;

      if (typeof(response.data.d.__next) != "undefined") {
            $http({
                method: 'GET',
                url: response.data.d.__next,
                headers: {
                    "Accept": "application/json;odata=verbose"
                }
            }).then(function successCallback(
                response) {
               $scope.ListData.concat(response.data.d.results);
            }, function errorCallback(response) {
                /* */
                console.log("HTTP Get Failed");
            });
        } else {
            executeFunction($scope.ListData)
        }

    },
    function errorCallback(response) {
        /* */
        console.log("HTTP Get Failed");
    });

However I have to now fetch of a list which contains 40 thousand plus items and it's no longer really feasible to do this bit of a hack.

My issue is that I can't figure out how to put the request in any sort of a loop because of $http's asynchronous callback and because I need to check the existence of d.__next inside the response data inside the success callback.

What would be the best way of going about doing this?

Jonathan Nakandala · Accepted Answer · 2016-02-25 13:41:57Z

0

I think you can use this:

$scope.ListData = []
$scope.getData =function (url) {

    $http({
      method: 'GET',
        url: url,
        headers: {
        "Accept": "application/json;odata=verbose"
        }
    }).then(function successCallback(response) {

        $scope.ListData = $scope.ListData.concat(response.data.d.results);

        if(typeof(response.data.d.__next) !== "undefined") {

          $scope.getData(response.data.d.__next) ;

        } else {
            executeFunction($scope.ListData)
        }

    },function errorCallback(response) {
         console.log("HTTP Get Failed");
    });

}

I simply wrapped your code in function with URL parameter. When next URL exists I call it recursively with new URL

edited Feb 25, 2016 at 13:41

Jonathan Nakandala

276 bronze badges

answered Feb 16, 2016 at 17:38

Przemek

8034 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Jonathan Nakandala Over a year ago

Excellent stuff, you and M21B8 came to a solution pretty much within a minute of each other. Just a small thing you both missed. You need a $scope.ListData = for the concat because the function returns a new array. Thanks for the help.

M21B8 · Accepted Answer · 2016-02-16 17:39:38Z

0

This technique is called Recursion. Essentially the method calls itself until it reaches a final conclusion.

function getResults(jsonLocation) {
  $http({
      method: 'GET',
      url: jsonLocation,
      headers: {
          "Accept": "application/json;odata=verbose"
      }
  }).then(function successCallback(
          response) {
          // console.log(response.data.d)
          $scope.ListData.concat(response.data.d.results);
          if (typeof(response.data.d.__next) != "undefined") {
              getResults(response.data.d.__next);
          } else {
              executeFunction($scope.ListData)
          }

      },
      function errorCallback(response) {
          /* */
          console.log("HTTP Get Failed");
      }
  );
}

$scope.ListData = {}; // maybe change this to [] depending on the structure
getResults(jsonLocation);

answered Feb 16, 2016 at 17:39

M21B8

1,89710 silver badges21 bronze badges

1 Comment

Jonathan Nakandala Over a year ago

Excellent stuff, you and Przemek came to a solution pretty much within a minute of each other but they just edged you out. Just a small thing you both missed. You need a $scope.ListData = for the concat because the function returns a new array. Thanks for the help.

Collectives™ on Stack Overflow

Angular http GET looping using new URL in response

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related