恢复网络连接后,无法加载HttpLoaderFactory转换器

时间:2018-06-25 09:32:56

标签: angular internationalization ionic3

我正在使用具有以下配置的应用程序:

  1. @ ionic / app-scripts:3.1.9
  2. Cordova平台:android 6.2.3
  3. 离子框架:离子角3.9.2

我正在使用@ ngx-translate / core中的翻译库进行翻译。 我面临的问题是,我的翻译器在第一种情况下可以正常工作,但是当我断开网络(数据连接)并稍后再恢复时,翻译器无法正常工作,它只会加载标签,而不会分配文本。

我正在使用的代码是

在module.ts文件中使用

import { HttpClient } from '@angular/common/http';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader'


export function HttpLoaderFactory(http: HttpClient) {
return new TranslateHttpLoader(http, '../../assets/i18n/', '.json');
}

@NgModule({
declarations: [

],
imports: [
TranslateModule.forRoot({
loader: {
      provide: TranslateLoader,
      useFactory: HttpLoaderFactory,
      deps: [HttpClient]
  }
})

我在Assets文件夹下的en.json文件是这样的

{
"DashboardPage": {
    "WelcomeText": "Welcome",
    "LastUpdatedText": "Last Updated on",
    "Disbursal": "Disbursal",
    "NEA" : "NEA",
    "Yield" : "Yield"
}
}

我正在这样的HTML上使用标签

 <div *ngIf="IsFromLogin">
      <h2 >{{'DashboardPage.WelcomeText' | translate}} {{userData.name}}</h2>
    </div>

当我恢复网络连接时,屏幕会显示DashboardPage.WelcomeText之类的标签,而不是在所有屏幕上都显示分配给它的文本。

我已经尝试了很少的事情,但是无法获得真正的原因。任何人都可以提出一些解决方案。谢谢!!

我想添加的另一件事仅在我们暂停其余页面上的移动数据连接时在应用程序所在的屏幕上无法正常运行,但即使我们导航,在面临问题的页面上也始终保持不变并从其他页面返回。

1 个答案:

答案 0 :(得分:0)

经过一天的努力,我已经解决了我的问题。

我已将此链接引用为同一Ionic3 lazy loading and translate don't work together

在我的页面module.ts中(例如在我的情况下,它的dashboard.module.ts) 代替

imports: [
TranslateModule.forRoot({
loader: {
  provide: TranslateLoader,
  useFactory: HttpLoaderFactory,
  deps: [HttpClient]
 }
})

我用过代码

imports: [
IonicPageModule.forChild(DashboardPage),
ComponentsModule,
TranslateModule.forChild()  
],