Хранение объектов в localStorage

У меня есть такой массив:

[{name:"test", time:"Date 2017-02-03T08:38:04.449Z"}]

Я сохранил его в localstorage и когда я localstorage данные из localstorage я получил значение:

[object, object]

Как я могу решить эту проблему?

config.ts

import { Injectable } from "@angular/core";

@Injectable()
export class TokenManager {

  public tokenKey: string = 'app_token';

  constructor() { }    

  store(content) {
    var contentData;

    console.log("inside localstorsge store:", content);
    contentData = content.map(
      (data) => data.name
    )
    console.log("contentData:", contentData)
    localStorage.setItem(this.tokenKey, content);
  }

  retrieve() {
    console.log("inside localstorage");
    let storedToken: any = localStorage.getItem(this.tokenKey);
    console.log("storedToken:", storedToken);//====> here this console is[object object]
    if (!storedToken) throw 'no token found';
    return storedToken;
  }

}

Ответ 1

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

var testObject ={name:"test", time:"Date 2017-02-03T08:38:04.449Z"};

Поместите объект в хранилище:

localStorage.setItem('testObject', JSON.stringify(testObject));

Извлеките объект из хранилища:

var retrievedObject = localStorage.getItem('testObject');

console.log('retrievedObject: ', JSON.parse(retrievedObject));

Ответ 2

Легко хранить объекты в локальном хранилище с помощью localDataStorage, где вы можете прозрачно установить/получить любой из следующих "типов",: Array, Boolean, Date, Float, Integer, Null, Object или String.

[ОТКАЗ ОТ ОТВЕТСТВЕННОСТИ] Я являюсь автором утилиты [/DISCLAIMER]

Примеры:

localDataStorage.set( 'key1', 'Belgian' )
localDataStorage.set( 'key2', 1200.0047 )
localDataStorage.set( 'key3', true )
localDataStorage.set( 'key4', { 'RSK' : [1,'3',5,'7',9] } )
localDataStorage.set( 'key5', null )

localDataStorage.get( 'key1' )   -->   'Belgian'
localDataStorage.get( 'key2' )   -->   1200.0047
localDataStorage.get( 'key3' )   -->   true
localDataStorage.get( 'key4' )   -->   Object {RSK: Array(5)}
localDataStorage.get( 'key5' )   -->   null

Как вы можете видеть, примитивные значения соблюдаются. Теперь, в вашем случае, мы сделаем следующее:

>localDataStorage.set( 'testObject', { name : 'test', time : new Date( '2017-02-03T08:38:04.449Z' ) } )

Обратите внимание, что вы можете явно выразить объект. (Все стробирование выполняется в фоновом режиме для вас.) Когда мы возвращаем ключ, получаем:

>localDataStorage.get( 'testObject' ) -->
>Object {name: "test", time: "2017-02-03T08:38:04.449Z"}

Ответ 3

немного поздно отвечать, но я хочу отвечать до тех пор, пока будущие зрители не смогут его использовать, javascript будет использовать объекты по ссылке, а затем, когда мы сохраняем объект в localStorage, в действительности мы сохраняем адрес объекта, а не содержимое объекта! тогда, если мы хотим сохранить содержимое объекта (мы абсолютно этого хотим), мы должны сделать, как показано ниже:

хранить как это:

localStorage.setItem('my_item', JSON.stringify(my_object));

и используйте так:

var my_object = JSON.parse(localStorage.getItem('my_item'));

надеюсь быть полезным :)