CODEWITHSUNDEEP
angularjs
Noor A Shuvo
Noor A Shuvo

Reputation: 2807

Call a asynchronous method after another in AngularJS

I have a $watch attached to the appId variable. SO, when appId get changed it called the init function

$scope.$watch('appId', function() {                
    if ($scope.appId != '') {
        console.log('Inside appId watch');
        $scope.init();
    }
});

init() calls two service methods

$scope.init = function() {

    if ($scope.appId === undefined || $scope.appId == '') return false;

    $scope.getPrincipals($scope.loadPrincipals);
    $scope.getSignaturesByAppId($scope.loadSignatures);     

};

The methods are 

$scope.getSignaturesByAppId = function (callback) {
    ApplicationDataSource.getSignaturesByAppId($scope.appId, function (result) {
        callback(result);
        $scope.$apply();
    });
};


$scope.loadSignatures = function (result) {
    var signatureResultSet = angular.fromJson(result[0]);
    $scope.appSignatures = signatureResultSet;

    if($scope.appSignatures.length===0){
        $scope.setDefaultValue();
    }
    else{
        $scope.setValueFromObject();
    }

};

$scope.getPrincipals = function (callback) {
    ApplicationDataSource.getApplicationPrincipalList($scope.appId, function (result) {
        callback(result);
        $scope.$apply();
    });
};

$scope.loadPrincipals = function (result) {
    var guarantorResultSet = angular.fromJson(result[0]);
    $scope.principals = guarantorResultSet;
};

The problem occurs here. In loadSignatures(), I have called a method setDefaultValue() which needs the data retrieve from loadPrincipals. So, when, loadSignatures called, principal data is not updated.

How to call the $scope.getPrincipals($scope.loadPrincipals) after $scope.getSignaturesByAppId($scope.loadSignatures) finish to retrieve data.

Upvotes: 0

Views: 28

Answers (2)

Noor A Shuvo
Noor A Shuvo

Reputation: 2807

What solve my issue is, I called $scope.getSignaturesByAppId($scope.loadSignatures); in loadPrincipals callback function, not in init() 

$scope.loadPrincipals = function (result) {
       var guarantorResultSet = angular.fromJson(result[0]);
       $scope.principals = guarantorResultSet;

       $scope.getSignaturesByAppId($scope.loadSignatures); 
};

Upvotes: 0

zuckerburg
zuckerburg

Reputation: 338

You can use Promises, here is an example:

var promise = callThatRunsInBackground();

promise.then(
  function(answer) {
    // do something
  },
  function(error) {
    // report something
  },
  function(progress) {
   // report progress
  });

So in your code it might look like (I will leave it to you to fix as I'm not going to compile or check for syntax errors):

var getPrincipals = $scope.getPrincipals($scope.loadPrincipals);

getPrincipals.then(
       function(datapayload) {  
            //do something with datapayload perhaps
            $scope.getSignaturesByAppId($scope.loadSignatures); 
     });

This will make it wait until getPrincipals is finished before running getSignaturesbyAppId

Upvotes: 2

Related Questions