angular - ng2-translate は localstorage を使用します

Question

選択した言語を ng2-translate を使用して Angular2 アプリケーションに保存するには、localstorage を使用する必要があります。

選択した言語をローカルストレージに保存することになっている次のクラスを見つけました。

import {TranslateLoader} from "ng2-translate/ng2-translate";
import {Observable} from "rxjs/Observable";
import {Response, Http} from "angular2/http";

export class TranslateLSLoader implements TranslateLoader {
    constructor(private http: Http, private prefix: string = 'i18n', private suffix: string = '.json') {}

    /**
     * Gets the translations from the localStorage and update them with the ones from the server
     * @param lang
     * @returns {any}
     */
    public getTranslation(lang: string): Observable<any> {
        return Observable.create(observer => {
            let translations = localStorage.getItem('ng2-translate-' + lang);
            if(translations) {
                observer.next(JSON.parse(translations));
            }

            this.http.get(`${this.prefix}/${lang}${this.suffix}`)
                .map((res: Response) => res.json())
                .subscribe((res: any) => {
                    observer.next(res);
                    localStorage.setItem('hmx-lang-' + lang, JSON.stringify(res));
                    observer.complete();
                });
        });
    }
}

機能しなかったため、私のバージョンの angular2 でこれを修正しました。

import {TranslateLoader} from "ng2-translate/ng2-translate";
import {Observable} from "rxjs/Observable";
import {Http, Response} from "@angular/http";
import {Injectable} from "@angular/core";

@Injectable()
export class TranslateLSLoader implements TranslateLoader {
    constructor(private http: Http) {}

    /**
     * Gets the translations from the localStorage and update them with the ones from the server
     * @param lang
     * @returns {any}
     */
    public getTranslation(lang: string): Observable<any> {
        return Observable.create(observer => {
            let translations = localStorage.getItem('ng2-translate-' + lang);
            if(translations) {
                observer.next(JSON.parse(translations));
            }

            this.http.get(`${'i18n'}/${lang}${'.json'}`)
                .map((res: Response) => res.json())
                .subscribe((res: any) => {
                    observer.next(res);
                    localStorage.setItem('hmx-lang-' + lang, JSON.stringify(res));
                    observer.complete();
                });
        });
    }
}

エラーは発生しませんが、機能しません。ページをリロードすると、デフォルトの言語が選択されます。

また、インポートで ng2-translate モジュールを構成する必要がありました。

TranslateModule.forRoot({
    provide: TranslateLoader,
    useClass: TranslateLSLoader
})

コードのどこが間違っているか知っていますか?