如何在 angularjs 中访问 $localStorage 中保存的数据

Question

我正在开发 MEAN 应用程序，在用户成功登录后，我想将返回的用户数据保存在浏览器的 localStorage 中，以便我可以进一步使用它，我正在使用 ngStorage 模块。我可以在浏览器的本地存储中保存用户数据。这是我在 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('/');
        }

不，当我在另一个控制器中访问 $rootScope 时，我可以获得存储在 $localStorage 中的值。即使在我的 chrome 浏览器中，我也可以通过检查看到数据存储在 $localStorage 中。 但是当我刷新页面时 我可以看到浏览器中的 localStorage 中仍有数据，但不在我的 $rootscope 中。我的 rootScope 在页面刷新后得到空数据，我非常感谢任何关于如何访问这些数据并存储在 rootScope 中的建议。

Answer 1

应用重新加载时从本地存储中检索用户数据

app.run(function($rootScope){
  if(localStorage['userData'])
  {
    $rootScope.userData = JSON.parse(localStorage.getItem('userData'));
  }
});

Answer 2

正如我所说，当您像任何 javascript 变量一样重新加载位置时，$rootScope 会被破坏。您的 localStorage 数据在整个应用程序的任何地方都可以访问，直到您销毁、删除或重置它。

    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('/');
                                }

      function anyController($scope, $localStorage) {
                                       console.log($localStorage.userData);
                                    }

一个示例，如果您通过模块运行函数中的 $localStorage 访问数据时没有 userData，则重定向到主状态。

angular.module("yourAppName")
  .run(function ($rootScope, $state,$localStorage) {
    $rootScope.$on("$stateChangeStart", function(event, toState, toParams, fromState, fromParams){
      if(toState.name == 'app') return;
      if (!$localStorage.userData){
        $state.transitionTo("app");
        event.preventDefault(); 
        return;
      }
    });
  });

如何在 angularjs 中访问 $localStorage 中保存的数据

how to access saved data in $localStorage in angularjs

javascript

local-storage

angularjs

rootscope