How to call a function on page load using Angular JS

Question

I have a angular controller which has bunch of functions which share the data between them. The problem is, The data which I return from function 1 is used in function 2 and then data returned in function 2 is used in function 3. My problem is the function 2 an d function 3 executes first and say that the data is not found is there a way where I can schedule the function 1 to execute first.

Following is my code for reference:

$scope.Read = function () {
    var get = ServiceName.Read();
    getConfig.then(function (d) {
        $scope.RID = d.data;
        alert($scope.RID);
    }, function (error) {
        $log.error('Oops! Something went wrong while fetching the application key data.' + error)
    })

}
$scope.Read();

Function 2 where I want to use the data:

$scope.getApp = function () {
        var sub ={
                "RID": $scope.RID
        }
        var App = ServiceName.getApp(sub);

        App.then(function (d) {
            $scope.LID = d.data.BUser;
        }, function (error) {
            $log.error('Opps! Something went wrong in getting appplication defaults');
        });
    }
    $scope.getApp();

Any help would be appreciated!

Thank You!

Best Regards,

Sandeep

Dylan · Accepted Answer · 2017-02-13 22:37:28Z

1

If the first 2 are calls to a service that returns a promise, which is looks like they are. Could you not call the function in the .Then()?

Example:

$scope.functionOne(){
  CallToService().then(function(data){
  //Success call Function 2
   $scope.functionTwo(data);
 },function Error(){
   //Error/
 }
};


$scope.functionTwo(){
  CallToService2().then(function Success(data){
    //Call function 3
    $scope.function3(data);
  },
  function Error(){
  //Error
  }
}

answered Feb 13, 2017 at 22:37

Dylan

1,1281 gold badge12 silver badges28 bronze badges

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

1 Comment

Marshall Over a year ago

Yes I did but to do that I need to pass a value to the function 2 which always say that the scope is undefined. I'm not sure where exactly I'm going wrong

Darin Cardin · Accepted Answer · 2017-02-13 22:30:20Z

0

If you need to initialize something, you could consider using config, or run:

angular.module('myModule', []).
config(function(injectables) { 

}).
run(function(injectables) { 

});

see more here: https://docs.angularjs.org/guide/module

answered Feb 13, 2017 at 22:30

Darin Cardin

7571 gold badge4 silver badges10 bronze badges

Comments

Smaïl Hammour · Accepted Answer · 2017-02-13 22:37:55Z

0

This happens because services are called asynchronously. You could chain the promises and return the value that you need in the next service and so on...

getConfig.then(function (d) {
  return d.data;
}, function (error) {
  
}).then(function(res){ 
  // Call second service with value returned from first service
}).then(function(res){
  // Call third service with value returned from second service
})

answered Feb 13, 2017 at 22:37

Smaïl Hammour

992 silver badges7 bronze badges

2 Comments

Marshall Over a year ago

So, I'm able to execute the function as you said, but even after i see that the function is executed first time, still the scope says that it is undefined for the next function

Marshall Over a year ago

$scope.getApp = function () { Read(); //calling function 1 here var sub ={ "RID": $scope.RID } var App = ServiceName.getApp(sub); App.then(function (d) { $scope.LID = d.data.BUser; }, function (error) { $log.error('Opps! Something went wrong in getting appplication defaults'); }); } $scope.getApp();

Collectives™ on Stack Overflow

How to call a function on page load using Angular JS

3 Answers 3

1 Comment

Comments

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

2 Comments

Related