Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

use ngx-translate in .ts file

I want to use a translation in sidemenu titles, I read this tutorial and I solve it as:

translate.get('HOME').subscribe(res => {

this.pages= [
 {title: res ,                  component: HomePage},
 {title: 'My Account',               component: MyAccountPage},
 {title: 'Changer Pass' , component: ChangePasswordPage}
]

It works, but the problem is that I want t get many title from the translation file to set them as sidemenu titles.

like image 620
Al-shimaa Adel Avatar asked Sep 12 '17 09:09

Al-shimaa Adel


People also ask

How do I translate words into components TS files?

component. ts file we need to import a translate service from @ngx-translate/core package inject the service in constructor and use it after changing the language. Now create a folder inside assets, name it 'translate,' inside of it create a json file.

How does Ngx-translate work?

What is ngx-translate? ngx-translate is the library for internationalizationinternationalizationInternationalization is the process of designing a software application so that it can be adapted to various languages and regions without engineering changes. Localization is the process of adapting internationalized software for a specific region or language by translating text and adding locale-specific components.https://en.wikipedia.org › Internationalization_and_localizationInternationalization and localization - Wikipedia (i18n) and localization in Angular. It simplifies your Angular application to work for localization. It's easy to set up and use in an Angular application.

How do I translate in angular 6?

The @ngx-translate/http-loader loads the translation files from your webserver. The HttpLoaderFactory is required for AOT (ahead of time) compilation in your project. First, you have to inject TranslateService in the constructor. The next step is to set the default language of your application using translate.


1 Answers

Please do not use the forkJoin operator in this case. ngx-translate supports fetching multiple translations at once by passing an array of keys to the get() method like this:

translate.get(['HOME', 'MY_ACCOUNT', 'CHANGE_PASSWORD']).subscribe(translations => {
  this.pages= [
    { title: translations.HOME, component: HomePage},
    { title: translations.MY_ACCOUNT, component: MyAccountPage},
    { title: translations.CHANGE_PASSWORD, component: ChangePasswordPage}
  ];
})

Edit:

Here you can find all supported methods and their signature.

like image 158
David Avatar answered Sep 28 '22 08:09

David