ngx-translate not showing any text in lazy-loaded module
Managed to solve the issue. In a quite unexpected way.
First, as Taranjit Kang mentioned, I imported TranslateModule to the SharedModule with forChild({})
method passing in an empty object. And exported it.
Also, I created a constructor in SharedModule, injecting TranslateService and initialising it with all the appropriate stuff.
SharedModule:
@NgModule({
imports: [TranslateModule.forChild({})],
exports: [TranslateModule]
})
export class SharedModule {
constructor(private translate: TranslateService) {
translate.addLangs(['en', 'ru']);
translate.setDefaultLang('en');
translate.use('en');
}
}
SharedModule is then imported to all the lazy-loaded modules.
Also, as before, I imported TranslateModule with forRoot(TRANSLATE_CONFIG)
method into AppModule.
TranslateModule.forRoot(TRANSLATE_MODULE_CONFIG)
Hope this will help.
When importing into components that are not the root component, I used the following:
TranslateModule.forChild({ loader: { provide: TranslateLoader, useFactory: HttpLoaderFactory, deps: [HttpClient] }, isolate: false, extend: true })
I had to set 'isolate: false' in order for it to work, took me a couple of days, very frustrating