如何设置和获取angular2-localstorage?

Vic*_*nak 10 local-storage typescript angular-local-storage angular

从这个回购,我已经成功配置了这个:

import {Component} from "angular2/core";
import {LocalStorageService} from "angular2-localstorage/LocalStorageEmitter";

@Component({
    provider: [LocalStorageService]
})
export class AppRoot{
    constructor(private storageService: LocalStorageService){}
...
}
Run Code Online (Sandbox Code Playgroud)

如何使用storageService设置或获取本地存储?即使在doc中我也找不到任何例子.

更新

经过一些测试,我已经设法让它通过WebStorage与Decorator合作:

import {LocalStorage, SessionStorage} from "angular2-localstorage/WebStorage";

@Component({})
export class LoginComponent implements OnInit {
   @LocalStorage() public username:string = 'hello world';
     ngOnInit() {
         console.log('username', this.username);
         // it prints username hello world
     }
}
Run Code Online (Sandbox Code Playgroud)

但是,当我使用Chrome Dev查看我的本地存储时,我什么都没看到: 在此输入图像描述

在另一个组件中,

import {LocalStorage, SessionStorage} from "angular2-localstorage/WebStorage";

@Component({})
export class DashboardComponent implements OnInit {
   @LocalStorage() public username:string;
     ngOnInit() {
         console.log(this.username);
         // it prints null
     }
}
Run Code Online (Sandbox Code Playgroud)

Mel*_*igy 6

该服务仅导入应用程序,以便它可以运行初始化代码.

你应该使用它的方式是通过装饰器提到的其他答案.

请注意,这意味着您只需要将服务导入到最根(app)组件,而不是所有使用装饰器的组件.

更新

也可以尝试在步骤2中使用的第一种方法的说明,使用bootstrap代替AppComponent.

不幸的是,这个库正在寻找新的维护者.所以不确定它有多可靠.