Function in Angular controller not returning data to the $scope variable

Question

Please correct me if I'm wrong: I want to get different types of bills for different tables in my view and this is the way I thought would be the best. Which is probably not.

In my view, I call:

Table 1:

{{billsTypeVariableIncome}}

Table 2:

{{billsTypeVariableBills}}

This is how my controller looks like:

$scope.billsTypeVariableIncome = getBillsByType(1);
$scope.billsTypeVariableBills = getBillsByType(2);
function getBillsByType(bill_type){

        $http.get("/api/bills/by/type/"+bill_type).
        success(function(data){
           return data;

        }).
        error(function(data){

            console.log('Error ' + data);

        })
    }

Im a rookie(obviously) so probably my approach is wrong. Any help is much appreciated!

You're calling a function before it's been defined. Define getBillsByType before calling it, JavaScript is executed from top to bottom. Also, getBillsByType doesn't return anything. You should set the $scope variables inside the success callback of the $http promise. — Andreas Argelius
– Andreas Argelius, Commented Dec 25, 2014 at 9:41
Putting the function before the $scope variables didnt help neither. Tried it before. I'm pretty sure my approach is wrong. It's feels primitive to me. — Deisy Laymi
– Deisy Laymi, Commented Dec 25, 2014 at 9:45

Shashank Agrawal · Accepted Answer · 2014-12-25 09:45:29Z

3

Whenever you use an $http service it always returns promise since AJAX requests are asynchronous and you are not sure about when the request will be completed. So promises are used to register callbacks.

And you are expecting return data from an promise object which can't be possible. So change your code to something like this:

$scope.getBillsByType = function(billType, variableName) {
    $http.get("/api/bills/by/type/" + billType).
    success(function(data) {
       $scope[variableName] = data;
    }).
    error(function(data){
        console.log('Error ' + data);
    })
};

$scope.getBillsByType(1, 'billsTypeVariableIncome');
$scope.getBillsByType(2, 'billsTypeVariableBills');

This is just an simple example, you can do in other ways also.

Hope this helps!

Thanks,
SA

answered Dec 25, 2014 at 9:45

Shashank Agrawal

25.9k11 gold badges98 silver badges126 bronze badges

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

1 Comment

Mritunjay Over a year ago

@DennisLaymi you should accept the answer, if you are not searching for one more answer.

Collectives™ on Stack Overflow

Function in Angular controller not returning data to the $scope variable

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related