rbalet / ngx-translate-multi-http-loader

A loader for ngx-translate that loads translations with http calls
MIT License
77 stars 15 forks source link

Multiple JSON translations from assets folder and API #27

Closed mx-tiem closed 1 year ago

mx-tiem commented 1 year ago

Hey there,

I'm trying to load multiple files from different sources, but it only reads one source.

I already have some translations in 'assets/i18n/' and I want to combine them with translations from API.

TranslateModule.forRoot({
    loader: {
        provide: TranslateLoader,
        useFactory: HttpLoaderFactory,
        deps: [HttpBackend]
    }
}),
export function HttpLoaderFactory(_httpBackend: HttpBackend) {
  return new MultiTranslateHttpLoader(_httpBackend, [
    { prefix: 'languages_api/translation/rim/'}, // API translations
    { prefix: 'assets/i18n/' }, // assets/i18n/ translations
    { prefix: 'assets/i18n/shared/', suffix: "_shared.json" }, // assets/i18n/ translations.
  ]);
}

When I only use API translations everything works fine. When I only use local files (one or more) everything is also working as expected.

The problem happens when I try to combine local files with API translations. No mater the order of importing into MultiTranslateHttpLoader(), the app is not translated with API translations, only local files do translations.

Maybe the worst thing in this situation is that there are no errors whatsoever. Console is perfectly clean and there is no compilation errors.

Could you please help?

rbalet commented 1 year ago

Hi @mx-tiem and thx for opening this issue.

Would you be able to send me the api that you try to reach, that I can see it out?

I honestly never have achieved to use it with an API because of the CORS error I get..

And pro tip, you can avoid writing the prefix it make your code more readable

export function HttpLoaderFactory(_httpBackend: HttpBackend) {
  return new MultiTranslateHttpLoader(_httpBackend, [
    'languages_api/translation/rim/', // API translations
    'assets/i18n/', // assets/i18n/ translations
    { prefix: 'assets/i18n/shared/', suffix: "_shared.json" }, // assets/i18n/ translations.
  ]);
}

I've published a new version that will log more information when having error https://github.com/rbalet/ngx-translate-multi-http-loader/releases/tag/v9.3.2

mx-tiem commented 1 year ago

My message was deleted because it contained my personal email. Thank you @rbalet for taking care of my privacy :)

mx-tiem commented 1 year ago

After testing on separate API and local files with @rbalet there is no bugs.

There is one last thing that I haven't tested very detailed, but seems like the root of the problem. My app uses RxJS 7.5.0 while ngx-translate-multi-http-loader requires 7.8.0

I'm not sure how this results in not showing API translations when there is file translations, but this seems to be the case.

Anyway, keep your apps updated.

Thanks for help @rbalet