AngularJS: Passing variables between controllers

Question

I am new to angular and I'm trying to find a method of passing variables between controllers. I saw the best method of achieving this was by using a service, as shown here - AngularJS: How can I pass variables between controllers?

However, this doesn't seem to be working with my code, as I will explain at the bottom.

Here is my service code,

app.service('loginService', function ($http) {

var loggedInUser = []

//If the login was successful this will be used
this.setLoginDetails = function(userDetails){
    loggedInUser.push(userDetails);
}

this.GetLoginUsername = function () {
    return loggedInUser.Username;
}

});

And now my two controllers,

app.controller('loginController', function ($scope, $rootScope, loginService, $location, $window) {

$scope.authenticateLogin = function () {

    // get record
    var user = {
        Username: $scope.username,
        Password: $scope.password
    };


    var promisePost = loginService.post(user);
    promisePost.then(function (result) {
        var res = result.data;
        //This is the important line
        loginService.setLoginDetails(user);

        $window.location.href = loginPageUrl;
    },
        function (errorResult) {
            console.log("Unable to log in : " + errorResult);
        });
}
});

my Controller that is trying to retrieve the information that has been set,

app.controller('userController', function ($scope, userService, $window, $modal, loginService) {

// Get the current logged in user
$scope.LoggedInAs = loginService.GetLoginUsername();

});

The issue I am having is that the username is being correctly set with the first controller, but when I try to access that information with the second controller the value for loggedInUser in null so the value is not being saved between the controllers. What am I doing wrong?

I think it's due to: $window.location.href = loginPageUrl; which refreshes the page rather than changing the state. — Thomas Nairn
– Thomas Nairn, Commented May 11, 2015 at 14:00
Thanks for the reply. What should I be using instead of this? — user3407039
– user3407039, Commented May 11, 2015 at 14:05
The other option is to store the login credentials (Which you'll probably want to do anyway) in a cookie or session to be read at a later date. — Thomas Nairn
– Thomas Nairn, Commented May 11, 2015 at 14:09
I think $location.path should do it for u. This might help: stackoverflow.com/questions/11003916/… — lolgans
– lolgans, Commented May 11, 2015 at 14:09

harishr · Accepted Answer · 2015-05-11 14:44:05Z

0

var loggedInUser = [] is an array, so if you want to get username you will have to do loggedInUser[0].Username and not loggedInUser.Username.

this.GetLoginUsername = function () {
    return loggedInUser[0].Username;
}

Also, as stated in comments either use ngRoute/uiRouter to change the page/url...

answered May 11, 2015 at 14:44

harishr

18.1k9 gold badges84 silver badges131 bronze badges

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

1 Comment

user3407039 Over a year ago

Did some more digging into ngroute, which I hadn't used before, and managed to get it working like that.

Collectives™ on Stack Overflow

AngularJS: Passing variables between controllers

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related