AngularJS: $http response too slow

Question

I am using this code:

$http.get('/api/users').
success(function(data) {
    $scope.authors = data;
}).
error(function() {
    console.log('API error - config.')
});

And somewhere below (much bellow):

for (var i = 0; i < $scope.authors.length; i++) {
    ...
};

Sometimes it happens that $scope.authors are not avaliable yet. Is there any way to solve this?

UPDATE

This is the whole block structure:

// author

$http.get('/api/users').
success(function(data) {
    $scope.authors = data;
    processAuthors();
}).
error(function() {
    console.log('API error - config.')
});    

// if updating form

$scope.$on('$routeChangeSuccess', function() {
    if($routeParams.id) {

        $http.get('/api/offers/' + $routeParams.id).
        success(function(data) {

            // author

            function processAuthors() {
                for (var i = 0; i < $scope.authors.length; i++) {
                    if($scope.authors[i].email == data.author.email) {
                        $scope.author = $scope.authors[i];
                    };
                };                    
            }

Make sure not to call the function containing the for loop until the authors are available. $http is asynchronous. You can't expect the response to be there immediately. For more help, post a complete example. — JB Nizet
– JB Nizet, Commented Jul 28, 2015 at 11:08

Bv202 · Accepted Answer · 2015-07-28 11:08:24Z

1

Put the loop in the succes part:

$http.get('/api/users').
success(function(data) {
    $scope.authors = data;
    for (var i = 0; i < $scope.authors.length; i++) {
       ...
   };
}).
error(function() {
    console.log('API error - config.')
});

answered Jul 28, 2015 at 11:08

Bv202

4,07415 gold badges49 silver badges81 bronze badges

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

Comments

Shomz · Accepted Answer · 2015-07-28 11:44:52Z

1

Yes, it doesn't matter how much below it is - you still need to call it from inside the callback because it's an async call:

function processAuthors() {
    for (var i = 0; i < $scope.authors.length; i++) {
      ...
    };
}

And then:

$http.get('/api/users').
success(function(data) {
    $scope.authors = data;
    processAuthors();
})

I used a function to make it look cleaner, but you can copy your code that depends on the callback inside it.

UPDATE

function processAuthors(data) {
            for (var i = 0; i < $scope.authors.length; i++) {
                if($scope.authors[i].email == data.author.email) {
                    $scope.author = $scope.authors[i];
                };
            };                    
        }

$scope.$on('$routeChangeSuccess', function() {
    if($routeParams.id) {

        $http.get('/api/offers/' + $routeParams.id).
        success(function(data) {

            // author
            processAuthors(data);  // just call it here, define it outside

edited Jul 28, 2015 at 11:44

answered Jul 28, 2015 at 11:08

Shomz

37.7k4 gold badges61 silver badges87 bronze badges

13 Comments

be-codified Over a year ago

This solution is actually great because my code is really much bellow :)

Shomz Over a year ago

Yeah, organizing code block into functions is always good. But sometimes you just need to do a little hack and make it messy. :)

be-codified Over a year ago

Indeed. Although my function processAuthors is inside $scope.on and $http.get and I am getting ReferenceError: processAuthors is not defined. Any ideas?

Shomz Over a year ago

You can't have it inside another callback because of JS scopes - it won't be available outside that function. If you show me that whole block, I'll probably be able to fix it.

be-codified Over a year ago

That block is really long. Where can I put it?

|

Collectives™ on Stack Overflow

AngularJS: $http response too slow

2 Answers 2

Comments

13 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

13 Comments

Your Answer

Sign up or log in

Post as a guest

Related