web-dev-qa-db-ja.com

Angular2ローカルストレージからデータを保存および取得する方法は？

ブラウザのlocalstorageに認証トークンを保存できましたが、文字列として取得できませんでした。その方法の例が見つかりません。

angularjstypescriptangularangular-local-storage
9
Raj Kumar

シリアル化と逆シリアル化をカプセル化するサービスを自分で作成できます。

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');
    }

    // ...
}
19
rinukkusu