Switching language doesn't work globally

[polaris327]

This is a function that I am using for toggling language between English and Dutch in my Angular 5 app.

toggleLanguage() {
    if (this.locale.getCurrentLanguage() === 'en') {
      this.locale.setDefaultLocale('nl', 'NL');
      this.locale.setCurrentCurrency('EURO');
    } else if (this.locale.getCurrentLanguage() === 'nl') {
      this.locale.setDefaultLocale('en', 'US');
      this.locale.setCurrentCurrency('USD');
    }
  }

Expected behavior When I trigger this function, I want it to update the languages in all components in the app. So in my current app, I want to update the languages in not only header component, but also login component and other components too. Actual behavior This function only updates its own component. So in my current app, this function is triggered in header component and it updates the texts in the header component only. Login component doesn't get updated. Steps to reproduce the behavior Project repo: https://github.com/polaris327/PhotoBook You can simply run the project locally by executing ng serve since this is a standard Angular Cli project.

StackBlitz Template: https://stackblitz.com/edit/angular-l10n

Specifications: Angular version, library version, environment, browser Angular 5, Angular Cli

[robisim74]

Hi @polaris327,

you have too many configurations in your app: you should remove the configuration from your SharedModule, and import/export only:

    LocalizationModule,
    LocaleValidationModule,

without calling the forRootmethod, and without calling the load method of l10nLoader.

See also the docs: https://robisim74.github.io/angular-l10n/spec/lazy-loading/#shared-modules

Try if this solves the problem.

[polaris327]

Hi @robisim74

Awesome! It works! You helped me save much time. Thank you so much!