$scope will be called before $http request in AngularJS

Question

Whenever program runs it first call the $scope method and hence I cannot get any data which will load Dbdata from $http method.

var fileData = $http.get("JS/filesystemsdata.json").success(function (data) {
    $scope.DbData = data;
    $scope.isDBLoaded = true;
}).error(function (status) {
    alert(status);
    $scope.isDBLoaded = false;
});

var afterdata = $scope.getChilds("Common Files", "c,Program Files");
console.log(afterdata);

Why dont you access $scope.DbData in your success promise? — lin
– lin, Commented Feb 11, 2017 at 9:32
$scope.getChilds() is called first and then $http is called due to which I am not getting required data. — Vaibhav Agrawal
– Vaibhav Agrawal, Commented Feb 11, 2017 at 9:33
Yea, we see that. This does not make any sense at all. Your data recived async. from your HTTP-Service is stored in $scope.DbData. So what you are trying to achieve while calling this unknown function $scope.getChilds() ? If you want $scope.getChilds() executed after the request was successful just put it inside your success function. — lin
– lin, Commented Feb 11, 2017 at 9:34

lin · Accepted Answer · 2017-02-11 09:41:06Z

1

Just put your function you like to execute into your success promise like:

var fileData = $http.get("JS/filesystemsdata.json").success(function (data) {
  $scope.DbData = data;
  $scope.isDBLoaded = true;
  var afterdata = $scope.getChilds("Common Files", "c,Program Files");
}).error(function (status) {
alert(status);
  $scope.isDBLoaded = false;
});

answered Feb 11, 2017 at 9:41

lin

18.5k4 gold badges66 silver badges88 bronze badges

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

Comments

kefir500 · Accepted Answer · 2017-02-11 09:58:29Z

Explanation

Contrary to your assumption stated in the question title, functions from your code will be called in a specified order:

$http.get
$scope.getChilds

However, the success and error callbacks for $http.get are asynchronous. That means that these functions will be called when the $http.get data is ready. I.e. this can take 1 millisecond or this can also take a whole minute (for example) – the success / error callbacks will be called when needed without stopping your main thread.

Solution

So the solution is to put the $scope.getChilds part in the success callback.
I suggest you to learn more about callbacks and promises to have a better understanding.

Side Note

Accroding to the AngularJS $http docs, success and error methods are deprecated, and you should use then instead:

The $http legacy promise methods success and error have been deprecated and will be removed in v1.6.0. Use the standard then method instead

jitendra varshney · Accepted Answer · 2017-02-11 12:41:51Z

0

if you want second thing execute after first thing then you can use $promise or then function(then is a combination of success and error and then is the new thing)

 var fileData = $http.get("JS/filesystemsdata.json").then(function(data){
    $scope.DbData = data;
    $scope.isDBLoaded = true;
    var afterdata = $scope.getChilds("Common Files", "c,Program Files");
    console.log(afterdata);
}, function(status){
    alert(status);
    $scope.isDBLoaded = false;
});

for then

https://docs.angularjs.org/api/ng/service/$http

for $q

https://docs.angularjs.org/api/ng/service/$q

answered Feb 11, 2017 at 12:41

jitendra varshney

3,5622 gold badges26 silver badges32 bronze badges

Collectives™ on Stack Overflow

$scope will be called before $http request in AngularJS

3 Answers 3

Comments

Explanation

Solution

Side Note

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Explanation

Solution

Side Note

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related