Romanchuk / angular-i18next

angular v10+ integration with i18next v19.4+
MIT License
130 stars 33 forks source link

"translation" won't get resolved as namespace was not yet loaded #78

Closed sarsahu922 closed 2 years ago

sarsahu922 commented 2 years ago

I'm having a warning that I think is a false positive. I get the thousands of the following warning: i18next.js:27 i18next::translator: key "xxx" for namespace "translation" won't get resolved as namespace was not yet loaded This means something IS WRONG in your application setup. You access the t function before i18next.init / i18next.loadNamespace / i18next.changeLanguage was done. Wait for the callback or Promise to resolve before accessing it!!!

I am using angular 12 Here is my code

export function appInit(i18next: ITranslationService) { return () => i18next .use(i18nextXHRBackend.default) .init({ whitelist: ['strings_en_US'], fallbackLng: 'strings_en_US', debug: true, returnEmptyString: false, ns: [ 'translation', 'validation', 'error'
], backend: { loadPath: function (langs, ns) { return './assets/strings/{{lng}}.json'; } } }); }

export function localeIdFactory(i18next: ITranslationService) { return i18next.language; }

export const I18N_PROVIDERS = [ { provide: APP_INITIALIZER, useFactory: appInit, deps: [I18NEXT_SERVICE], multi: true }, { provide: LOCALE_ID, deps: [I18NEXT_SERVICE], useFactory: localeIdFactory }];

Can somebody have any idea?

Romanchuk commented 2 years ago

@sarsahu922 I'm not sure i fully understand you translation is the default namespace and also it is in your 'ns' array (https://www.i18next.com/overview/configuration-options). Probably you don't have translation.json for your lang, so i18next warns you. It is native 'i18next' behavior. If you think you found a bug, you should create issue at https://github.com/i18next

In angular-i18next i've added error handling strategy. It's possible to make strict checks on initialization and your app won't load if langs and namespaces failed to load. But aware that strict error strategy will block users to work with your app completely, if you miss one file (or for some reason it hasn't been loaded). So i recommend to use default/native error handling, since even if an error happened users can still interact with your app.

https://github.com/Romanchuk/angular-i18next#error-handling

**Error handling*** Error handling is now configurable:

  1. By default i18next promise will use NativeErrorHandlingStrategy. I18Next would be always resolve succesfully. Error could be get from 'then' handler parameter.
  2. Set StrictErrorHandlingStrategy to reject load promises (init, languageChange, loadNamespaces) on first load fail (this was default in v2 but changed to fit native i18next behavior: I18NextModule.forRoot({ errorHandlingStrategy: StrictErrorHandlingStrategy })
Romanchuk commented 2 years ago

Closed due inactive