Question

我在Angular应用程序中使用Satellizer进行身份验证并且几乎所有工作正常...除了我似乎无法弄清楚如何在成功登录后显示用户名（或电子邮件）导航栏。

我的登录控制器看起来像这样

$scope.login = function() {
   $auth.login($scope.user).then(function(response) {
      $scope.user = JSON.stringify(response.data.user);
      localStorage.setItem('user', user);
      $scope.user = response.data;
      $rootScope.authenticated = true;
      $rootScope.currentUser = response.data.user;
      // redirect user here after successful login
      $state.go('home');
   }
}

我在我的$状态（使用UI路由器）进行全局访问

.run(function ($rootScope, $auth, $state) {
    $rootScope.$on('$stateChangeStart', function (event, toState, fromState) {
        if (toState.loginRequired && !$auth.isAuthenticated()) {
        //if ($auth.isAuthenticated()) {
            $rootScope.currentUser = JSON.parse($state, localStorage.currentUser);
        //$rootScope.currentUser = JSON.stringify($state, localStorage.currentUser);
            $state.go('/login');
            event.preventDefault();
        };
    });
  });

然后在我的导航栏控制器中

.controller('NavbarCtrl', function($scope, $rootScope, $window, $auth) {
    $scope.isAuthenticated = function() {
      return $auth.isAuthenticated();
      $scope.user.email = $localStorage.currentUser.email;
    }
}

我在控制台中没有收到任何错误，所以我不确定我错在哪里......？

currentUser在localStorage中未定义，我以为我在上面的登录控制器代码中设置了它？？

Answer 1

首先，您在user登录后存储localStorage.user对象，然后阅读currentUser中的NavbarCtrl

$localStorage.currentUser.email;

您应该使用相同的属性user，即

$scope.user.email = localStorage.user.email;

但是，为什么你需要在本地存储中使用它？由于您将currentUser放在$rootScope中，因此您应该能够在导航栏中直接使用它，例如

<span>{{currentUser.email}}</span>

在Angular登录后，在每个网页上显示用户名

1 个答案: