Angular wait for a $http call to execute the next function

Question

I had been searching for this same issue here, I found something but all that seems to not be working for me. Let me describe my scenario:

I am adding some features to a Web app done by myself, that Web app is used to manage the developing of the webpage of some customers. Each customer has a webpage and for each customer there are a list of proposals webpages and who of the designers did that proposal, fine.

The list of the developers and be able to see who did what is the new thing in the Web app and the reason of my question, so, the problem is:

Once the web app loads I get the list of developers from the DB and a list of all the customers that have a webpage. So, the next thing the web app does is auto-select the first customer of the list and show its proposals in another list. To do that, the list of the developers is needed, but as it hasnt been still loaded I get the:

Cannot read property '0' of undefined

When I want to iterate over the $scope.developers object

What I do to get the developers is a $http call like this:

 $http({
        method: 'POST',
        url: url,
        headers: {'Content-Type': 'application/x-www-form-urlencoded'}
    }).success(function(data) {
        $scope.developers = data;
    });

I know $http performs async calls, but i need something that waits until the $scope.developers has the data loaded.

The problem comes when I need to use the data supposedly stored in $scope.developers but obvously its not. I tried to call the function that uses the $scope.developers inside the .success function but the same happens.

I tried to use the solution in this thread but I get the same error.

How to wait till the response comes from the $http request, in angularjs?

Any help ?? If something in my question is not clear I will try to explain it better.

Answer 1

Please just define $scope.developers as empty array before $http call ie

app.controller("someCtrl", function($scope, $http) {

  $scope.developers = [];
    //....
  $http({
    method: 'POST',
    url: url,
    headers: {
      'Content-Type': 'application/x-www-form-urlencoded'
    }
  }).success(function(data) {
    $scope.developers = data;
  });

  //..

});