如何从 Angular2 本地存储中保存和检索数据?
how to save and retrieve data from Angular2 local storage?
我能够在浏览器的 localstorage
中存储一个授权令牌,但我无法将其作为字符串检索。我找不到有关如何执行此操作的任何示例。
你可以自己写一个服务来封装序列化和反序列化:
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 {
// ...
}
然后在你需要的组件中,在构造函数中注入即可:
export class SomeComponent {
private someToken: string;
constructor(private storageService: StorageService) {
someToken = this.storageService.read<string>('my-token');
}
// ...
}
我能够在浏览器的 localstorage
中存储一个授权令牌,但我无法将其作为字符串检索。我找不到有关如何执行此操作的任何示例。
你可以自己写一个服务来封装序列化和反序列化:
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 {
// ...
}
然后在你需要的组件中,在构造函数中注入即可:
export class SomeComponent {
private someToken: string;
constructor(private storageService: StorageService) {
someToken = this.storageService.read<string>('my-token');
}
// ...
}