Различные значения хранятся с сохранением строки с помощью localStorage и $localStorage с Angular 1.

В моем угловом контроллере я пытаюсь сохранить токен при возврате из конечной точки API, которая возвращается в виде строки. Для этого примера я заменил его на переменную testData.

var testData = "testdata"

$localStorage['jwtToken'] = testData
localStorage.setItem('jwtToken',testData)

Для первой строки это то, что хранится:

{"ngStorage-jwtToken" : ""testdata""}

Первая вторая строка:

{"jwtToken" : "testdata"}

Я понимаю, почему ключ меняется, но я не понимаю, почему вокруг строки данных, хранящейся в значении ключа в первой строке, стоит двойное "".

Кто-нибудь сталкивался с этим раньше? Я делаю что-то не так?

Все усилия, чтобы добавить код ниже.

angular.module('app', [
  'ngAnimate',
  'ngAria',
  'ngCookies',
  'ngMessages',
  'ngResource',
  'ngSanitize',
  'ngTouch',
  'ngStorage',
  'ui.router'
]);

app.controller('SigninFormController', ['$scope', '$http', '$state', '$localStorage',
  function($scope, $http, $state, $localStorage) {
    $scope.user = {};
    $scope.authError = null;
    $scope.login = function() {
      $scope.authError = null;
      // Try to login
      $http.post('api/auth/login', {
          email: $scope.user.email,
          password: $scope.user.password
        })
        .then(function(response) {
          if (response.status = 200 && response.data.token) {

            var testData = "testdata"

            $localStorage['jwtToken'] = testData
            localStorage.setItem('jwtToken', testData)


            /*
                $localStorage['jwtToken'] = response.data.token
                localStorage.setItem('jwtToken',response.data.token)
                */

            $state.go('app.home');
          } else {
            $scope.authError.message
          }

        }, function(err) {
          if (err.status == 401) {
            $scope.authError = err.data.message
          } else {
            $scope.authError = 'Server Error';
          }
        });
    };
  }
]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script>



<body ng-controller="">
  <div class="container w-xxl w-auto-xs" ng-controller="SigninFormController">

  <div class="m-b-lg">
    <div class="wrapper text-center">
      <strong>Sign in to get in touch</strong>
    </div>
    <form name="form" class="form-validation">
      <div class="text-danger wrapper text-center" ng-show="authError">
        {{authError}}
      </div>
      <div class="list-group list-group-sm">
        <div class="list-group-item">
          <input type="email" placeholder="Email" class="form-control no-border" ng-model="user.email" required>
        </div>
        <div class="list-group-item">
          <input type="password" placeholder="Password" class="form-control no-border" ng-model="user.password" required>
        </div>
      </div>
      <button type="submit" class="btn btn-lg btn-primary btn-block" ng-click="login()" ng-disabled='form.$invalid'>Log in</button>
      <div class="text-center m-t m-b"><a ui-sref="access.forgotpwd">Forgot password?</a></div>
      <div class="line line-dashed"></div>
      <p class="text-center"><small>Do not have an account?</small></p>
      <a ui-sref="access.signup" class="btn btn-lg btn-default btn-block">Create an account</a>
    </form>
  </div>
  <div class="text-center" ng-include="'tpl/blocks/page_footer.html'">
  
  </div>
</div>
</body>

1 ответ

Почему двойные кавычки

Мне нужно было бы взглянуть на исходный код, но, скорее всего, причина, по которой они заключают в кавычки строку, заключается в том, что они могут использовать JSON.parse() и получить правильный объект / массив / строку из хранилища без необходимости пытаться выяснить типы.

Основная идея:

localStorage.setItem('xxx', '"testData"');
var val1 = JSON.parse(localStorage.getItem('xxx'));

localStorage.setItem('yyy', '"testData"');
var val2 = JSON.parse(localStorage.getItem('{"foo" : "bar"}'));

Почему они добавляют имя ключа?

Они могут перебирать ключи и знать, какие ключи локального хранилища являются угловыми, а какие - чем-то еще. Они могут заселить свой объект.

var myStorage = {};
Object.keys(localStorage).forEach(function(key){
    if (key.indexOf("ngStorage")===0) {
       myStorage[key.substr(10)] = JSON.parse(localStorage[key]);
    }
});
Другие вопросы по тегам