使用ngx-translate实现延迟加载的i18n翻译文件

如何解决使用ngx-translate实现延迟加载的i18n翻译文件

所以我正在开发一个大型的角度应用程序，该应用程序需要按模块拆分翻译文件，并且仅在模块被懒加载时才加载它们。

目前，我使用各种资源实现它的方式已经达到了这样的程度：我的惰性加载组件确实确实在加载时加载了必要的翻译，但是，它对语言的变化没有反应。对修复我的设置方式的任何帮助将不胜感激。

Angular应用模块：

export function rootLoaderFactory(http: HttpClient,authService: AuthenticationService) {
  return new LanguageLoader(http,authService);
}

@NgModule({
  imports: [
    SharedModule,NavigationModule,LoginModule,TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,useFactory: rootLoaderFactory,deps: [HttpClient,AuthenticationService]
      },}),

在这里，我使用的是一个简单的自定义加载程序，该加载程序仅通过http触发器从azure函数获取翻译。

导航模块 该模块不是延迟加载的。该模块设置默认语言，并具有允许用户在翻译之间进行切换的组件

@NgModule({
  imports: [SharedModule,TranslateModule],declarations: [Header],providers: [HeaderService],exports: [Header],})

export class NavigationModule {
  constructor(translate: TranslateService) {
    translate.addLangs(["en","fr"]);
    translate.setDefaultLang('en');

    const browserLang = translate.getBrowserLang();
    translate.use(browserLang.match(/en|fr/) ? browserLang : 'en');
  }
}

标题组件

      <div style="display:inline-block" clrDropDownItem>
          <p id="language">{{ 'NAV.HEADER.SELECT' | translate }}</p>
          <select id="selector" #langSelect (change)="translate.use(langSelect.value)">
            <option *ngFor="let lang of translate.getLangs()" [value]="lang" [selected]="lang === translate.currentLang">{{ lang }}</option>
          </select>
        </div>

该选择器始终对标题组件中的用户可见。

现在，应该是延迟加载的模块，它应该在导航模块中扩展翻译并为该模块添加新的翻译。

团队模块（延迟加载）

export function childLoaderFactory(http: HttpClient,authService,environment.teamsApiUrl,environment.teamsKey);
}

@NgModule({
  declarations: [
    TeamsComponent
  ],imports: [
    CommonModule,SharedModule,TranslateModule.forChild({
      loader: {
        provide: TranslateLoader,useFactory: childLoaderFactory,extend: true,})
  ]
})
export class TeamsModule {
  constructor(translate: TranslateService) {
    let temp = translate.currentLang;
    translate.currentLang = '';
    translate.use(temp);
  }
}

此模块将加载在加载模块时设置的正确语言，但是它不会对导航模块中更改的语言作出反应。加载不会再次触发。

我还简单地在共享模块中导入和导出了转换模块，以便共享中的组件可以使用该服务。

我已经尝试订购语言更改服务，然后再次执行translate.use（LANG），但是它仍然不会触发其他负载。

任何有关我可能在哪里寻找答案的建议或解释，将不胜感激。