Translation function not executed for components using ngx-translate with ngx-translate-messageformat-compiler

UI Components for Angular
Post Reply
Posts: 3
Joined: 30 Dec 2020, 17:48

08 Jan 2021, 15:17

Hi, to implement internationalization and pluralization I tried to use ngx-translate with ngx-translate-messageformat-compiler.

If not using the latter I also get to work PrimeNg componets to be translated (e.g a calendar). When I use ngx-translate-messageformat-compiler somehow the translation function handed over to PrimeNGConfig is not executed properly. Does anyone an explanation or solution for this?


Code to feed translation to primeNG componets:

Code: Select all

    this.translateService.get('primeng').subscribe(res => this.primengconfig.setTranslation(res));
in app.module:

Code: Select all

      defaultLanguage: 'nl',
      loader: {
          provide: TranslateLoader,
          useFactory: (createTranslateLoader),
          deps: [HttpClient],
      compiler: {
        provide: TranslateCompiler,
        useClass: TranslateMessageFormatCompiler

using angular 9.0.4

Code: Select all

 "primeng": "^11.0.0-rc.2",

Posts: 1
Joined: 30 Apr 2021, 20:35

01 May 2021, 03:38

I was able to fix this issue by doing the following

async applyLanguageChange() {
this.translate.get('PrimeNg', {}).subscribe(res => {
const translations = this.fixPrimeNGTranslations(res);

private fixPrimeNGTranslations(translations: any) {
switch (typeof translations) {
case 'function':
return translations();
case 'object':
if (Array.isArray(translations)) {
return => this.fixPrimeNGTranslations(t));

for (const key in translations) {
translations[key] = this.fixPrimeNGTranslations(translations[key]);
return translations;
return translations;

In order for this to work you must follow the following instructions to set-up your own translations for PrimeNG

This seems to be a PrimeNG issue since the simple values of primeNg translations are translated properly but not arrays, like months, daysOfTheWeek, etc.

It is possible to observe this issue using
this.primeNgConfig.translationObserver.subscribe(translations => {

Post Reply

Return to “PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 6 guests