1

I have recently started working on Angular 9 project, I am using ngx-translate for internationalization. I implemented basic poc using this https://stackblitz.com/github/ngx-translate/example

The issue is code inside constructor need to repeated multiple time in different components, I need to avoid that duplication of code in multiple components.

constructor(public translate: TranslateService) {
translate.addLangs(['en', 'fr']);
translate.setDefaultLang('en');

const browserLang = translate.getBrowserLang();
translate.use(browserLang.match(/en|fr/) ? browserLang : 'en');}

I tried following this approach Angular 5 - Service provider injection in all components with extends, but could not succeed.

Any help will be appreciated. Thanks

Surendra Mourya
  • 593
  • 3
  • 8
  • 29

1 Answers1

2

What you have done on your stack blitz is correct;

You don't need to repeat that code on other components, If you create an other component in the app.module you will be able to use the pipe translate with the language configured by your drop down

Here is the updated stackblitz (check comp2 component) https://stackblitz.com/edit/github-dcfbmu

CharybdeBE
  • 1,791
  • 1
  • 20
  • 35
  • And how would I use `translate.get('SHARED.LOGIN')` programmatic syntax without fetching it from constructor in every component? – ViBoNaCci Feb 25 '21 at 17:13