Repository: ngx-translate/core

Issue #1266: Angular translation forchild not loading
Created: 2020-11-13T21:34:53Z
I have an angular application that uses ngx-translation. For this, I made a Shared module that loads a translation file containing different keys (general errors...) :
`@NgModule({
imports: [
TranslateModule.forChild({
loader: {
provide: TranslateLoader,
useFactory: TranslateFactory,
deps: [HttpClient]
}
}),
],
exports: [TranslateModule],
})
export class TranslatorModule {
constructor(translate: TranslateService){
translate.addLangs(['fr']);
translate.setDefaultLang('fr');
const browserLang = translate.getBrowserLang();
translate.use(browserLang.match(/fr/) ? browserLang : 'fr');

}
}
export function TranslateFactory(http: HttpClient) {
return new TranslationService(http, 'assets/i18n');
}`
In my AppModule, I load this module and I also load another translation file via forRoot :
`@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule,
AppRoutingModule,
SharedModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: TranslateFactory,
deps: [HttpClient]
}
}),
],
bootstrap: [AppComponent]
})
export class AppModule{
}
export function TranslateFactory(http: HttpClient) {
return new TranslationService(http, 'assets/i18n/myApp');
}`
My problem is that only translateService.forRoot works. Translations from translateService.forChild are not loaded
Then I just use my shareModule in my loaded modules in lazy loading mode

Duplicate issue #1302: .forChild({}) is not loading anything
Created: 2021-04-15T15:02:25Z
Hello.
I'm facing an issue with loading translations. The thing is only main is loading, but everything else is not.
What I'm doing wrong?
translate.loader.ts
import { TranslateLoader } from '@ngx-translate/core';
import { Observable, from } from 'rxjs';

export class TranslateLoaderFactory {
  static forModule(module: string): any {
    console.log('module', module); // calls for each feature
    return class LazyTranslateLoader implements TranslateLoader {

      getTranslation(lang: string): Observable<any> {
        console.log('module for ' + lang, module); // calls only for main translations (from AppModule)
        return from(import(`assets/i18n/${module}/${lang}.json`));
      }
    };
  }
}
app.module.ts
@NgModule({
  imports: [
    StoreModule.forRoot({
      ...
    }),
    EffectsModule.forRoot([
      MainEffects  // here's  an effect that call: `.setDefaultLang('en')` and `.use('en')` 
    ]),
    TranslateModule.forRoot({
      extend: true,
      isolate: false,
      loader: {
        provide: TranslateLoader,
        useClass: TranslateLoaderFactory.forModule('main'),
        deps: [HttpClient],
      },
      compiler: {
        provide: TranslateCompiler,
        useClass: TranslateMessageFormatCompiler,
      },
    }),
    ... // other modules
  ]
})
export class AppModule {}
shared.module.ts
@NgModule({
  imports: [TranslateModule], // other modules as well
  exports: [TranslateModule], // other modules as well
})
export class SharedModule {}
feature1.module1.ts
@NgModule({
  imports: [
    TranslateModule.forChild({
      extend: true,
      isolate: false,
      loader: {
        provide: TranslateLoader,
        useClass: TranslateLoaderFactory.forModule('feature1'),
        deps: [HttpClient],
      },
      compiler: {
        provide: TranslateCompiler,
        useClass: TranslateMessageFormatCompiler,
      },
    }),
    ... // other modules
  ]
})
export class Feature1 {}

Closing comment (2021-05-28T15:54:22Z): Duplicate of #1266 ? This seems to be old problem because we couldn't make forChild to work correctly when there was a need, so we just went with single json file per project (actually we have 2 files, but loading both on app init).
Also, this library seems to be abandoned as its creator joined Angular team to work on native angular i18n library.