AngularJS: Send $http.get requests continuously until certain condition

Question

As the title says, I want to send $http.get requests to the server until the returned results meets a condition.

This is what I tried:

    var searchComplete = false;
    var sendGetReq = true;

    while(!searchComplete) // #2 and then jumps here
    {
       if(sendGetReq)
       {
         sendGetReq = false;  // #1 execution reaches here
         $http.get('/user/getCondition', {params: {condition: $scope.condition}).
        success(function (condition, status, headers, config) {
         ...
         ...
         if(condition)
         { searchComplete = true; }
         else
         { sendGetReq = true; }
    }
}

However, the $http.get request never goes. That statement is never reached. When I debugged, I saw that execution will come to sendGetReq=false and then jump to while(!searchComplete). The GET request is never sent.

Would someone please explain:

Why the execution never reaches GET request and jumps back
What is the recommended way to to do this continuous GET request

Thank you.

Use .then, not .success, and you should make this a recursive function. Don't expect perfect behavior using a while and a promise together. Make youself a function that calls itself once the promise has returned. — Andrew Donovan
– Andrew Donovan, Commented Aug 30, 2016 at 14:55

Gustavo Gabriel · Accepted Answer · 2016-08-30 15:18:08Z

3

Why not put it all together inside a function and call itself if condition is meet? Like this and you should use .then and not .success:

$scope.load = function(){
  $http.get('/user/getCondition', {params: {condition: $scope.condition}).
    then(function (condition, status, headers, config) {

    if (condition){
       $scope.load();
    }

  });
}

Hope it helps =)

edited Aug 30, 2016 at 15:18

answered Aug 30, 2016 at 15:02

Gustavo Gabriel

1,2963 gold badges17 silver badges29 bronze badges

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

Comments

atn · Accepted Answer · 2016-08-30 15:06:16Z

Do not use while (true), especially in JS.

JS works in one thread. $http.get will never run because your main thread stalled in you infinite loop and do not gave a chance for other threads to run.

Update

function getHttpPromise() {
    return $http.get('/user/getCondition', {params: {condition: $scope.condition}).
        success(function (condition, status, headers, config) {
         ...
         ...
         if(condition)
             return true;//or any result you want to resolve
         else
             return getHttpPromise();
    }
}

getHttpPromise function returns promise, which will be resolved on your condition, in other case it will continues waiting with followed get request.

To use it, run the following code.

getHttpPromise().then(function (result) {
    // Will be called only when condition will be successful
});

Umair Farooq · Accepted Answer · 2016-08-30 15:09:01Z

2

$http.get is asynchronous call and it will hit the success or error (both are deprecated, use then) function on response from server. When the function reaches this line

sendGetReq = false;  // #1 execution reaches here

it makes the $http.get call (which is async) and then it moves the control to next iteration. That is the main purpose of async call.

If you want to make continuous calls you can write the $http.get call in a function and call that function using interval service of Angular JS.

$interval

$scope.func = function(){
   if(condition)
   {
      $http.get....
   }      
}

$interval($scope.func, 1000)

where 1000 is the time interval in milliseconds after which the function is called

edited Aug 30, 2016 at 15:09

answered Aug 30, 2016 at 15:02

Umair Farooq

1,7022 gold badges14 silver badges25 bronze badges

2 Comments

gianlucatursi Over a year ago

with $timeout you call the function just one time. Maybe you need $interval but anyway is not a good solution. You should use the then (success) for call recursively your function

Umair Farooq Over a year ago

@gianlucatursi Edited my answer for $interval

Wasiq Muhammad · Accepted Answer · 2016-08-30 15:02:17Z

1

Try this inject $interval in your controller

var startInterval = $interval(function(){
  var searchComplete = false;
  var sendGetReq = true;

        sendGetReq = false;  // #1 execution reaches here
        $http.get('/user/getCondition', {params: {condition: $scope.condition}).
        success(function (condition, status, headers, config) {
         if(condition)
         {   searchComplete = true;
            $scope.stopInterval();
         }
         else
         { sendGetReq = true; }
        })

},1000)

$scope.stopInterval = function(){
   $interval.cancel(startInterval)
}

answered Aug 30, 2016 at 15:02

Wasiq Muhammad

3,1483 gold badges19 silver badges30 bronze badges

Comments

Khelmo · Accepted Answer · 2016-08-30 15:11:53Z

1

As Andrew said it should be recursive and in your case use .then. To make it recursive encapsulate your $http service inside a function

.controller('YourController', function($http) {
this.sendGetReq= function(data) {
    $http.get('/user/getCondition', {params: {condition: data.condition}).
    .then(function(res) {
        if (res.condition) {
        //finish your search
        } else {
        //set newdata somehow   
          this.sendGetReq(newdata);
        }
    }
};

});

answered Aug 30, 2016 at 15:11

Khelmo

3642 silver badges7 bronze badges

Collectives™ on Stack Overflow

AngularJS: Send $http.get requests continuously until certain condition

5 Answers 5

Comments

Comments

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related