I have been working on a MEAN app, and after a user successfully logs in, I want to save the returned user data in the localStorage of the browser for future use. I am using the ngStorage module for this purpose. Below is the code snippet from my LoginController:
function loginController($http, $location, $rootScope,$localStorage){
var vm = this;
vm.signIn = signIn;
function signIn() {
$http({
url: '/login',
method: 'post',
data: vm.login
}).then(function(respond) {
if(respond.data){
$localStorage.userData = respond.data;
var info = $localStorage.userData;
$rootScope.userInfo = info;
$location.path('/dashboard/'+respond.data._id);
}else{
$location.path('/');
}
Now when I access $rootScope in another controller, I can get the value that is stored in $localStorage. Even in my Chrome browser's inspect tool, I can see that the data is stored in $localStorage. However, when I refresh my page, I notice that although the data still exists in the browser's localStorage, it becomes null in my $rootScope after refreshing the page. I would appreciate any suggestions on how to retain this data in the $rootScope even after refreshing the page.