javascript - Keep waiting for loop increment until not getting function response -

i have loop , inside calling 1 function. before function response loop variable incremented 1. want wait until response has come, increment var 1.

here code:

    for(var i=0;i<$scope.latitude.length;i++)         {               console.log("inside :",$scope.latitude[i]);               console.log("i after for:" ,i);             console.log("count before if:" ,count);                    if($scope.latitude[i]!=1)                    {                          console.log("inside if count :",count);                         console.log("i inside if:" ,i);                             var lat =$scope.latitude[i];                             var lng=$scope.longitude[i];                         console.log("lat going",lat);                        console.log("lng going",lng);                            $scope.getdistance(lat,lng).then(function(response,flag){                         console.log("flag is" ,flag);                        settimeout(function(){                                 flag="true";                         },1000);                  var results = response.rows[0].elements;                  console.log(results[0].distance.text);                 console.log(results[0].duration.text);                  return results[0].distance.text                }).done(function(distancematrixresult,flag) {                     console.log("flag inside done is:" ,flag);                        console.log("count ",count);                     console.log("i inside done:" ,i);                      console.log(distancematrixresult);          $scope.clients.treasurehunts[count].distance =distancematrixresult;                        $ionicloading.hide();                  console.log("results:->>>>>>>>>>>>", json.stringify( $scope.clients)); 

})

$scope.getdistance=function(lat,lng){        console.log("lat inside google distance function:-" ,lat);            console.log("lng inside google distance function:-" ,lng);              var service = new google.maps.distancematrixservice();           $scope.destinationdetails = {             lat: lat,             lng: lng             }              console.log("destination:-" ,json.stringify(  $scope.destinationdetails.lat));          console.log("destination:-" ,json.stringify(  $scope.destinationdetails.lng));            //getting current location                var onsuccess = function (position) {               console.log('current position: ', position.coords.latitude, ',', position.coords.longitude);              $scope.origincenter = {                  lat: position.coords.latitude,                 lng: position.coords.longitude              };                         geocodelatlng($scope.origincenter);                }                 function onerror(error) {             console.error('code: ' + error.code + '\n' + 'message: ' + error.message + '\n');             //alert('error occured' + error.message);         }         navigator.geolocation.getcurrentposition(onsuccess, onerror);/////////---------------------------------                 function geocodelatlng(origincenter) {                  console.log("destination inside function:-" ,json.stringify(  $scope.destinationdetails.lat));          console.log("destination inside function:-" ,json.stringify(  $scope.destinationdetails.lng));               $scope.origindetails = new google.maps.latlng(origincenter.lat, origincenter.lng);             console.log('origin details: ',json.stringify($scope.origindetails));             $scope.finaldestination = new google.maps.latlng($scope.destinationdetails.lat, $scope.destinationdetails.lng);             console.log('destination details: ', json.stringify($scope.finaldestination));              service.getdistancematrix(                  {                     origins: [$scope.origindetails],                     destinations: [$scope.finaldestination],                     travelmode: google.maps.travelmode.driving,                     unitsystem: google.maps.unitsystem.metric,                     avoidhighways: false,                     avoidtolls: false                 },                 function (response, status) {                     if (status !== google.maps.distancematrixstatus.ok) {                         console.error(json.stringify(response));                        d.reject(response);                        } else {                         console.log("returning response ",json.stringify(response));                         var flag="true";                       d.resolve(response,flag);                         }                       }); 

since js single threaded (as far regarded here) there can not loop waiting other happening in js code (like callbacks executed..).

looping on asynchronous calls need split functionality async callback/success-handler (add error handling well;), e.g. this:

function makenextcall(i, total, oncompleted) {    if( >= total) {     oncompleted();               // signal completion of whole iteration   } else {    makeasynccall(i, {                        // make asynchronous call      onsuccess : function() {                // define callback       makenextcall(i+1, total, oncompleted); // next iteration     }    });    } }