angular.js getting var from inside function

Question

I am getting data from the server with a service which is being called in this function:

LeadsSrv.async().then(function (d) {
    results = d.data;
});

I want to access the results outside of this function and then assign it to the scope, like this:

$scope.All_Leads = results;

Here is the server function:

LeadApp.service('LeadsSrv', function ($http) {
  var all = {
    async: function() {
        var promise = $http({
            url: '../app/Data.php',
            method: "POST",
            params: { req_id: 'leads_list', user_id: 1 }
        }).then(function (response) {
        return response;
      });
      return promise;
    }
  };
  return all;
});

How can i achieve this?

Is the server function being called in an Angular service or is it within a controller? — navigator
– navigator, Commented Mar 15, 2016 at 12:21

Alex Szabo · Accepted Answer · 2016-03-16 21:42:33Z

3

You declare the variable at the beginning of your script, then whenever the function fetching the data returns, it will update the value of that variable.

$scope.results = [];

LeadsSrv.async().then(function (d) {
    $scope.results = d.data;
});

Thanks to how angular works, you won't need to do anything else, it will also update the UI elements and bindings as well.

Update:

I'd do it this way:

Service:

LeadApp.service('LeadsSrv', function ($http) {
    var service = {
        postData: postData
    };

    return service;

    function postData(data) {
        return $http.post('../app/Data.php', data);      
    }

In the Controller:

//Initialize the variable
$scope.results = [];

var data = {
    req_id: 'leads_list',
    user_id: 1
};

LeadsSrv.postData(data).then(function (response) {
    //Once the $http.post succeeds, it will update your variable
    $scope.results = response.data;
});

This should do exactly what you're looking for, unless I've misinterpreted your question.

edited Mar 16, 2016 at 21:42

answered Mar 15, 2016 at 12:19

Alex Szabo

3,2842 gold badges21 silver badges33 bronze badges

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

4 Comments

jhon dano Over a year ago

yes your solutions works but am getting the data from the server which worked before also, but my question is how can i now access the scope var outside of the function to make it available on my entire site?

Alex Szabo Over a year ago

@jhondano could you please specify "entire site"? Is it all in angular, or is it a mix, etc?

jhon dano Over a year ago

The site is all in angular!

Alex Szabo Over a year ago

If you only use one controller, it should be available by $scope.results inside angular, or {{results}} in HTML.

Slytherin · Accepted Answer · 2016-03-15 12:20:36Z

0

I recommend going about this in following fasion.

Make your controller/directive ( whoever owns the $scope ) dependent on LeadSrv object. If it is not an "angular" component already wrap it in a factory, then inject it in your controller.

Then you simply do

LeadsSrv.async().then(function (d) {
    $scope.All_Leads = d.data;
});

answered Mar 15, 2016 at 12:20

Slytherin

4743 silver badges17 bronze badges

Comments

Aer0 · Accepted Answer · 2016-03-15 12:23:00Z

0

Currently, you are doing the right thing, except of one mistake: Your call is getting executed asynchronously. So that basically means, results won't have the expected value the time you are referring it to $scope.All_Leads, since the declaration is happening synchronously.

To achieve what you want, you have to use promises. Take a look at this and Angulars documentation.

answered Mar 15, 2016 at 12:23

Aer0

3,90720 silver badges35 bronze badges

Comments

georgeawg · Accepted Answer · 2016-03-15 16:32:14Z

0

To check if your server is reporting an error, add a .catch method.

LeadsSrv.async().then(function onFulfilled(r) {
    console.log("DATA: ", r.data);
    $scope.results = r.data;
}).catch( function onRejected(response) {
    console.log("ERROR: ", response.status);
});

answered Mar 15, 2016 at 16:32

georgeawg

49k13 gold badges77 silver badges98 bronze badges

Collectives™ on Stack Overflow

angular.js getting var from inside function

4 Answers 4

4 Comments

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

4 Comments

Comments

Comments

Comments

Linked

Related