如何從Angular2本地存儲中保存和檢索數據？

Question

我能夠在瀏覽器的localstorage中存儲身份驗證令牌，但我無法將其作爲字符串檢索。我找不到有關如何做到這一點的任何示例。

Answer 1

你可以寫自己的服務來封裝序列化和反序列化：

export class StorageService { 
    write(key: string, value: any) { 
     if (value) { 
      value = JSON.stringify(value); 
     } 
     localStorage.setItem(key, value); 
    } 

    read<T>(key: string): T { 
     let value: string = localStorage.getItem(key); 

     if (value && value != "undefined" && value != "null") { 
      return <T>JSON.parse(value); 
     } 

     return null; 
    } 
} 

將它添加到您的供應商無論是在bootstrap電話：

bootstrap(App, [ ..., StorageService]); 

或在你的根組件：

@Component({ 
    // ... 
    providers: [ ..., StorageService] 
}) 
export class App { 
    // ... 
} 

然後在你需要它的組件中，只需將它注入t他的構造函數：

export class SomeComponent { 
    private someToken: string; 

    constructor(private storageService: StorageService) { 
     someToken = this.storageService.read<string>('my-token'); 
    } 

    // ... 
}