如何在Ionic中将翻译文件(下载后)保存在本地?

时间:2019-08-16 06:45:04

标签: ionic-framework storage translation

我需要从远程服务器下载翻译文件,并将其保存在本地,以免每次重新加载应用程序时都下载该文件。

文件已下载,但我无法保存。

import { Storage } from '@ionic/storage';

...

constructor(
        private http: HttpClient,
        private storage: Storage
    ) {
    }

    getTranslation(lang: string): Observable<any> {
        return new Observable((observer) => {

            this.http.post(SERVER_BASE_URL, null, {headers: this.contentHeader}).subscribe((res: Response) => {
                    console.log('get translation from server');
                    console.log(res);
                     this.storage.set("test", res).then(response => {
                         console.log("save translation");
                     }).catch(error => {
                         console.log("error");
                         console.log(error);
                     })
                    observer.next(res);
                    observer.complete();
                },
                error => {
                    console.log('get translation from local');
                    //  failed to retrieve from api, switch to local
                    this.http.get('/assets/i18n/' + lang + '.json').subscribe((res: Response) => {
                        observer.next(res);
                        observer.complete();
                    });
                });
        });
    }

我尝试使用存储,但是出现错误 “无法读取未定义的属性'set'”

我已经在应用程序的其他部分使用了存储,并且可以正常工作。所以我不明白为什么在translationService中它不起作用。

感谢您的帮助。

2 个答案:

答案 0 :(得分:0)

如果要存储对象或列表,则

this.storage.set('test', JSON.stringify(this.res));

获取时

this.storage.get('test').then(value => {
          let res = JSON.parse(value);
      }).catch(err=>{
   console.log(err)
})

如果要保存文件,则 https://stackoverflow.com/a/57497397/7456041

答案 1 :(得分:0)

我尝试将文件保存在本地,但我遇到相同的错误:无法读取未定义的属性'writeFile'。

this.http.post(apiAddress, body, {headers: this.contentHeader}).subscribe((res: Response) => {
                        console.log('get translation from server');
                        console.log(res);

                        this.file.writeFile(
                            this.file.dataDirectory,
                            lang + '.json',
                            JSON.stringify(res),
                            {replace: true}).then(_ => {
                            console.log('Directory exists');
                        }).catch(err => {
                            console.log('Directory doesn\'t exist');
                        });

                        observer.next(res);
                        observer.complete();
                    },
                    error => {
                        console.log('get translation from local');
                        //  failed to retrieve from api, switch to local
                        this.http.get('/assets/i18n/' + lang + '.json').subscribe((res: Response) => {
                            observer.next(res);
                            observer.complete();
                        });
                    });

我发现了我错过的一切。在app.module.ts中,我需要添加“ deps”以使用依赖项...

  TranslateModule.forRoot({
        loader: {
            provide: TranslateLoader,
            // useFactory: (createTranslateLoader),
            useClass: TranslationService,
            deps: [HttpClient, File]
        }
    }),

感谢您的帮助。