JanuszFrontEnd'u
JanuszFrontEnd'u

Reputation: 471

ERROR: Can't resolve all parameters for CustomTranslateLoader ... json import problem?

I'm using translate and I had to write my own loader because the default one was based on httpClient. My solution works, the project starts and languages ​​change. So everything works very well. Unfortunately, when I try to build ng build my-lib --prod I get an error. I guess it's related to json? (Angular 9).

custom-loader.ts

import { TranslateLoader } from '@ngx-translate/core';
import { Observable, of } from 'rxjs';
import * as en from '../../../lib-assets/i18n/en.json';
import * as pl from '../../../lib-assets/i18n/pl.json';

export class CustomTranslateLoader implements TranslateLoader {
  constructor(private availableLang: any = { en, pl }) {}
  getTranslation(lang: string): Observable<any> {
    return of(this.availableLang[lang].default);
  }
}

tsconfig.json

"resolveJsonModule": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,

error after ng build my-lib --prod:

ERROR: Can't resolve all parameters for CustomTranslateLoader in /Projects/my-app/projects/my-lib/src/lib/core/translate/custom-loader.ts: (?).

An unhandled exception occurred: Can't resolve all parameters for CustomTranslateLoader in /Projects/my-app/projects/my-lib/src/lib/core/translate/custom-loader.ts: (?).

Upvotes: 2

Views: 958

Answers (4)

micronyks
micronyks

Reputation: 55443

export class CustomTranslateLoader implements TranslateLoader {

  // original code doesn't have key in the object. you must have key in the object as shown below

  private availableLang: any = { en: en, pl: pl };          

  constructor() {}

  getTranslation(lang: string): Observable<any> {
    return of(this.availableLang[lang].default);
  }
}

Upvotes: 2

Ganesh
Ganesh

Reputation: 6016

It's because of the initialization of the param avilableLang as Adya pointed out.

There are different set of rules for compiling against AOT and JIT. So try to initialize the variable outside of constructor.

Upvotes: 2

Adya
Adya

Reputation: 1112

It occurs because of this I guess : constructor(private availableLang: any = { en, pl }) {}

If you want to provide availableLang = { en, pl } then initializing it in OnInit() life cycle hook is a better place. We use constructor for dependency injection mainly. Try to implement this change.

Upvotes: 2

surendra kumar
surendra kumar

Reputation: 1780

Have you did the below code in your app.module.ts

 TranslateModule.forRoot({
 
      loader: {
  
        provide: TranslateLoader,
  
        useClass: CustomTranslateLoader
  
  
      }
  
     })

Upvotes: 1

Related Questions