CODEWITHSUNDEEP
javascriptajaxangularjs
elpeyotl
elpeyotl

Reputation: 372

Nested Loops in ajax call / angular

I'm trying to Loop trough a variable, search for the ID's and then make an ajax call to get the Detailcontent of the different ID's in the Success function I try to loop trough the received content and get the emails out.

It is working but i get the first email twice in my $scope.subContactmail. I think there is a problem with the loop but i don't get it. Was trying to figure it out the whole night and unfortunately no idea came trough. The idea should be that if the first loop is finished it will start with the second loop. But at the moment the first loop goes trough the second as well.

Problaby your pros out there can help me with this problem.

Looking forward for your help!

Here is the specific part of my angular app file: 

//find all contract relations id's from customer
      $scope.contactrelation = function (input) {
      $http.post('http://localhost/mamiexpress/mamiAPI/includes/php/searchContactsRelation.php', input).
          success(function(data, status, headers, config) {
          $scope.subContactDetails =  [];
          $scope.subContactmail =  [];
          $scope.subContactId = data;
          console.log($scope.subContactId);

              //GET ALL the subcontact ID's from the selected item
                var i=0;
                var subContactIdlenght = $scope.subContactId.length;
                while  (i < subContactIdlenght) {
                console.log($scope.subContactId[i].contact_sub_id);
                var number = $scope.subContactId[i].contact_sub_id;
                i = i + 1;

              //Send the ID to the API and get the user Details
                $http.post('http://localhost/mamiexpress/mamiAPI/includes/php/searchContactswithID.php', number).
                    success(function(data, status, headers, config) {
                        $scope.subContactDetails.push(data); // store it in subContactDetails
                        console.log($scope.subContactDetails);


                       //HERE COULD BE THE PROBLEM!!
                       // I want this loop to start when the first loop is finished but i have to run this in this success function.
                       // At the moment i get the first email twice!

                       //Loop trough ContactDetails and get the emails.   
                       if (i == subContactIdlenght){ 
                           var subContactDetailslength = $scope.subContactDetails.length;
                              for(var p=0; p < subContactDetailslength; p++) {
                              console.log($scope.subContactDetails[p].mail);
                              var number = $scope.subContactDetails[p].mail;
                              $scope.subContactmail.push(number);
                              };   
                        };

                    }).
                    error(function(data, status, headers, config) {
                    $scope.errormessage = data;
                    console.log(data);
                    });

                 };//ENDWHILE


        console.log(data);
        }).
        error(function(data, status, headers, config) {
         $scope.errormessage = data;
          console.log(data);
        });

Upvotes: 0

Views: 757

Answers (2)

Ahmed Adel
Ahmed Adel

Reputation: 181

you have 2 solutions

Use the promise API (recommended):

something like that

var wheatherPromise = $http.get(...);
var timePromise = $http.get(...);

var combinedPromise = $q.all({
    wheather: wheatherPromise,
    time: timePromise
})

combinedPromise.then(function(responses) {
    console.log('the wheather is ', responses.wheather.data);
    console.log('the time is ', responses.time.data);
});

OR

simply do the following:

  • make ur $http request in a seperated function or (AJS service is recommended).
  • call that function in a for loop based on ur list
  • declare a scope variable holds an empty array inside the function
  • push response objects in the array

avoid defining $http.get inside a for loop which cause unexpected behavior

Upvotes: 2

Drath Vedro
Drath Vedro

Reputation: 330

I think what you need is promises/deferred API here.

Upvotes: 0

Related Questions