Ngx-translate on new lazy page in Ionic 4


Dear forum members,

i am new to ionic 4 and did not use angualr and ionic since ionic1. I have one beginner question and would be very thankful if soeone could give me a hint on what i am overlooking.

I am using angular 7 and ionic 4 for my application and want to make on multilanguage on buttonclicks. For this purpose i tried the ngx-translate module: If i make the tutorial and create a new angular application everything works.

It even works in my ionic application, but only if i translate text chunks in the app.component.html According to the instructions i have to importy and modify app.module.ts and app.component.ts.

However, i want to translate some text in other pages then the app.componen.html. There are a lot of pages and they are all lazy loaded.

What am i doing wrong at this stage? What do i need to import in other pages in order to translate text there? My example page is “tab1” page. I have imported import { TranslateService } from ‘@ngx-translate/core’; in the tab1.module.ts But if i try to translate ion-card-title>


on buttonclick nothing happens and the resource from json in the default language is not loaded.

My second question considers the imported “HttpClientModule” and the “HttpModule”. Why does the ngtx-translate docu suggests to import HttpClientModule and the ionic docu suggests to import HttpModule? What is the difference anyway?

Thank you a lot in advane.

Kind Regards

D. Petrik


Ok sorry for my desperate post. It was triggered by yyesterdays feeling. Now i found this thread and this helped me to achieve my goals: [ionic 4] Anybody has a working demo using ngx-translate and ionic 4.0.0-rc.0?

This contains the required information what to add on new sites.


@Kypez so you are good or still need help?


Hey reedrichards. The problem is solvved. I thought maybe for all the people who are new to ionic 4 this post could be useful, so i did not delete it.

But second question is still open. Does anyone know the difference between the imported “HttpClientModule” and the “HttpModule”? And the reason why does the ngtx-translate docu suggests to import HttpClientModule and the ionic docu suggests to import HttpModule?

Kind Regards

D. Petrik

1 Like

Good to know you solved your issue

HttpModule is the old Angular http module which was deprecated in favor of HttpClientModule

Regarding code: Nothing change with ngx-translate from Ionic v3 to v4 as this library is dependent form Angular not Ionic. What did change is actually the version of Angular as Ionic v4, the Angular version, comes with Angular v7 and Ionic v3 with Angular v6, that’s the reason why ngx-translate has to be updated. But code wise, same same

1 Like