AngularJS - use variable declared in a promise

Question

I'm trying to call service within a function and then to use response data from the service, using .then, but I'm not able to return anything from that function

 var status;

 var getStatus = function(data,$scope){

            registrationService.registration(data,$scope)
            .then(function (response) {

                return status = response.status;

                console.log("Status1: " + status);
            });     

}


status = getStatus(data,$scope);
console.log("Status2: " + status);

when I move service call outside function all works fine

        registrationService.registration(data,$scope)
        .then(function (response) {

            status = response.status;

            console.log("Status1: " + status);
        }); 

but in this case I'm not able to access status variable outside callback which I need to reuse to check statuses.

Answer 1

Couple of things. One, assignments return undefined.

So,

return status = response.status;

Is returning undefined.

Two, a return statment will stop the execution of a function block.

This call below is not console.logging, because that return prevents it from reaching the console.log.

registrationService.registration(data,$scope)
            .then(function (response) {

                return status = response.status;

                console.log("Status1: " + status);
            });   

This call is (that you say is working, which I assume means you're getting that console.log) is working NOT because you pulled it out of the function, but because you removed the return statement.

registrationService.registration(data,$scope)
        .then(function (response) {

            status = response.status;

            console.log("Status1: " + status);
        }); 

Update with more detail:

getStatus returns nothing so it returns undefined. Which means status is getting set to undefined right before your final console log.

status = getStatus(data,$scope);

If registrationService.registration(data,$scope) is async then you're going to have to wait until it resolves before console.logging. Currently you console.log synchronously right after you execute getStatus

Update 2

var status;

 var getStatus = function(data,$scope){

    return registrationService.registration(data,$scope)
            .then(function (response) {

                status = response.status;

                console.log("Status1: " + status);
            });     

}


getStatus(data,$scope)
    .then(function () {
        console.log("Status2: " + status);
    })

Update 3

For the follow up question in the comments below, you should really refactor it like this:

function getStatus (data,$scope){

    return registrationService.registration(data,$scope)
            .then(function (response) {

                if (response.status === "pending") {
                    return getStatus(data, $scope)
                } else if (response.status === "accepted") {
                    // return something else
                } else {
                    // return something else 
                }
                console.log("Status1: " + status);
            });     

}
getStatus(data, $scope)
    .then(function (data) {
        // do whatever you want
    });