How to the objects to perform calculation in angularjs

Question

I am using angularjs in my project.

I am able to fetch the records from Database and binding in html page.Here I need to get the data from 4 collections in database so I need to perform several server calls to get the data. When i am assigning everything in separate Scope variables. My sample code is below

var click = function(){    
     $http.get('/CalBuildingget').then(function (response) {                    
                    $scope.ViewBuildings = response.data;

                    });

     for (i = 0; i < $scope.ViewBuildings.length; i++) {
        $http.get('/CalBuildingFloorget/'+ scope.ViewManageBuildings[i]._id).then(function (response) {                                
                    $scope.floorDetails = response.data;        
                        });
                     }

Here I need to fetch floors for each Building by its Id and store in building scope as an array object and then by floor id fetch again units which again needs to do server calls and assign inside the scope.

How can I achieve that as first it performs the loop then it starts server call of building.

Maciej Szpyra · Accepted Answer · 2017-04-25 09:58:23Z

0

You need to fetch floors in success callback of first request. So something like this.

var click = function(){    
 $http.get('/CalBuildingget').then(function (response) {                    
                $scope.ViewBuildings = response.data;
                for (i = 0; i < $scope.ViewBuildings.length; i++) {
                  $http.get('/CalBuildingFloorget/'+  scope.ViewManageBuildings[i]._id).then(function (response) {                                
                $scope.floorDetails = response.data;        
                    });
                 }
                });

answered Apr 25, 2017 at 9:58

Maciej Szpyra

3121 silver badge12 bronze badges

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

Comments

Junaid Sarwar · Accepted Answer · 2017-04-25 10:09:53Z

0

You'll mess up the whole performance of your application with approach you are using, are you sure that you want to send HTTP call in loop? think of a case when you have around 1000 records, shall you afford to send 1000 HTTP calls to server? instead why don't you fetch floorDetails in /CalBuildingget/ ?

Never send HTTP calls in loop, think of network bandwidth and application performance.

answered Apr 25, 2017 at 10:09

Junaid Sarwar

2092 silver badges13 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 12:34:09Z

0

For multiple subsequent service calls you should always utilise promise concept. conceptually it should be like below:

function callServiceForEachItem() {
  var promise;

  angular.forEach(items, function(item) {
    if (!promise) {
      //First time through so just call the service
      promise = fakeService.doSomething(item);
    } else {
      //Chain each subsequent request
      promise = promise.then(function() {

        return fakeService.doSomething(item);
      });
    }
  });
}

use this link for best practice perform chain service call

you can check this discussion

edited May 23, 2017 at 12:34

CommunityBot

11 silver badge

answered Apr 25, 2017 at 10:28

sujeet kumar srivastava

1825 bronze badges

Collectives™ on Stack Overflow

How to the objects to perform calculation in angularjs

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related