web-dev-qa-db-fra.com

$ rootScope.currentUser est null lors de l'actualisation

J'ai pu faire fonctionner FirebaseSimpleLogin et stocker l'utilisateur actuel dans rootScope. Quand je suis allé sur une autre page et que je reviens à la page de flux, tout se charge, mais quand je rafraîchis $ rootScope.currentUser est nul. Quelqu'un d'autre a-t-il eu ce problème?

J'ai ce morceau de code dans ma fonction app.run:

$rootScope.$on('$firebaseSimpleLogin:login',function(e, auth){
   $rootScope.currentUser = User.find(auth.id);
});

Et c'est mon FeedCtrl qui essaie de charger dans les messages de l'utilisateur

app.controller('FeedCtrl',['$scope', '$rootScope','User','Auth','Post',function($scope,     $rootScope,User,Auth,Post){
 populateFeed();
 console.log($rootScope.currentUser);

$scope.logout = function(){
   Auth.logout();
};


$scope.savePost = function(){
  Post.create($scope.post).then(function(post){
    $scope.post.text = "";
  });
};

function populateFeed(){
   $scope.posts = {};
   angular.forEach($rootScope.currentUser.posts,function(id){
    $scope.posts[id] = Post.find(id);
   });
}

}]);

Mon module d'application principal

var app = angular.module('myapp',['ui.router','firebase']);

app.config(function($stateProvider, $urlRouterProvider){
  $stateProvider
.state('/',{
  url: '/',
  controller: 'MainCtrl',
  templateUrl: 'views/index.html'
})
.state('feed',{
  url: '/feed',
  controller: 'FeedCtrl',
  templateUrl: 'views/feed.html',
  authenticate: true
})
.state('login',{
  url: '/login',
  controller: 'LoginCtrl',
  templateUrl: 'views/login.html'
})
.state('signup',{
  url: '/signup',
  controller: 'LoginCtrl',
  templateUrl: 'views/signup.html'
})
.state('settings',{
  url: '/settings',
  controller: 'SettingsCtrl',
  templateUrl:"views/settings.html"
})
.state('profile',{
  url: '/:slug',
  controller: 'ProfileCtrl',
  templateUrl: 'views/profile.html'
})
.state('profile-about',{
  url: '/:slug/about',
  controller: 'ProfileCtrl',
  templateUrl: 'views/profile.html'
});

$urlRouterProvider.otherwise('/');
})
.constant('FIREBASE_URL','https://{FIREBASE}.firebaseio.com/')
.run(function($rootScope, $state,FIREBASE_URL, $firebaseSimpleLogin, User, Auth){
$rootScope.$on('$stateChangeStart',function(event, next){
  if(next.authenticate && !User.getCurrentUser()){
     $state.go('login');
  }
 });

 $rootScope.$on('$firebaseSimpleLogin:login',function(e, auth){
   $rootScope.currentUser = User.find(auth.id);
  });

 $rootScope.$on('$firebaseSimpleLogin:logout',function(){
  delete $rootScope.currentUser;
  $state.go('login');
 });

 $rootScope.logout = function(){
  Auth.logout();
};

});
angularjsfirebaseangularfire
18
Markus Gray

Si vous par `` rafraîchir '' signifie que vous appuyez sur F5 dans le navigateur, cela effacera votre $ rootscope de la mémoire et vous obtiendrez un retour nul au fur et à mesure de votre expérience (fondamentalement, votre application entière sera `` redémarrée '').

Pour conserver les valeurs, vous devez soit les stocker dans un cookie, soit utiliser localStorage/sessionStorage. Par exemple, au lieu d'utiliser $ rootscope.currentUser, utilisez $ window.sessionStorage.currentUser.

28
lindstromhenrik

Pour le stocker dans localStorage: $ window.localStorage.setItem ("currentUser", currentUser);

ou stockez au format json: $ window.localStorage.setItem ("currentUser", angular.toJson (currentUser));

Pour l'obtenir à partir de là: var currentUser = $ window.localStorage.getItem ("currentUser");

ou si vous l'avez enregistré en utilisant la deuxième méthode: var currentUser = JSON.parse ($ window.localStorage.getItem ("currentUser"));

10
A. El Idrissi