AngularJS pass service variable to controller

Question

I built a simple app with user authentication base on this: link

Basically, I have a userAccountService, responsible for communicating with server and login controller handling the login process.

From other controller I want to check if user is already logged in (to hide LogIn button, and show user profile instead).

So I have a navController

function navCtrl ($scope, $modal, userAccountService) {

    $scope.IsUserLoggedIn = function () {
        return userAccountService.isUserLoggedIn;
    } 

}

So in HTML I use this ng-hide="isUserLoggedIn()

my userAccountService:

app.factory('userAccountService', ['$http', '$q', userAccountService]);

function userAccountService($http, $q) {

    var service = {
        registerUser: registerUser,
        loginUser: loginUser,
        logOut: logOut,
        getValues: getValues,
        isUserLoggedIn: false,
        accessToken: ""
    };

    // code ommited
    function loginUser(userData) {
        var tokenUrl = serverBaseUrl + "/Token";
        if (!userData.grant_type) {
           userData.grant_type = "password";
        }

        var deferred = $q.defer();

        $http({
            method: 'POST',
            url: tokenUrl,
            data: userData,
        })
            .success(function (data,status,headers,cfg) {
                // save the access_token as this is required for each API call. 
                accessToken = data.access_token;
                isUserLoggedIn = true;
                // check the log screen to know currently back from the server when a user log in successfully.
                console.log(data);
                deferred.resolve(data);
            })

            .error(function (err, status) {
                console.log(err);
                deferred.reject(status);
            });

        return deferred.promise;
    }
}

What am I doing wrong? Here's another interesting read I took inspiration from: link

We don't know what you're doing wrong, because you didn't tell us what your problem is. What behavior are you expecting? What is happening? — JeffryHouser
– JeffryHouser, Commented Mar 29, 2014 at 22:28

Shomz · Accepted Answer · 2014-03-29 23:19:16Z

2

You can't return a variable, but you can return a function, so create a function that returns that variable.

Try something like this, it returns your service object (you might want to put a $watch on it):

Service

function userAccountService($http, $q) {

  function getData() {
      return service;
  }
  ...
}

Controller

$scope.IsUserLoggedIn = userAccountService.getData().isUserLoggedIn;

Also, you're not correctly updating the state variable from your success callback - you're creating global variables instead of using the service object properties. So, for example:

isUserLoggedIn = true;

should be:

service.isUserLoggedIn = true;

edited Mar 29, 2014 at 23:19

answered Mar 29, 2014 at 23:14

Shomz

37.7k4 gold badges61 silver badges87 bronze badges

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

6 Comments

wojciech_rak Over a year ago

Still doesn't work - I put console.log(service) to $http.success in loginUser - isUserLoggedIn is set to true. I put getData function and in my controller the same line as You wrote here.

Shomz Over a year ago

And, what happens? I'm not sure I was able to catch all you wrote.

wojciech_rak Over a year ago

The service object printed to console has property isUserLoggedIn: true, but in my nav controller, $scope.IsUserLoggedIn = userAccoutnService.getData().isUserLoggedIn is still false. I added console.log() do getData() function, it seems it's never called.

Shomz Over a year ago

Any chance you could replicate it in jsfiddle or plnkr?

Shomz Over a year ago

Note that I'm also updating the $scope.IsUserLoggedIn inside of your login function... Which is ok, I guess, but you can use $watch there if you wish.

|

Collectives™ on Stack Overflow

AngularJS pass service variable to controller

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related