Angular + Electron with ngx-translate

Question

I have an Angular application and now a desktop version of it is also needed. I managed it to run the application in electron and everything works as expected.

But the localization does not work. In the electron- application I only see the localization- keys which points to the actual translation in the localization files.

I mainly translate the text in Angular like this:

{{ "localization-key" | translate }}

And the translations as json-files are based in assets/i18n/

Does someone has an idea how to get the localization work?

Answer 1

I also had this problem. I found the solution in the offical documentation of ngx-translate.

If you want to configure a custom TranslateLoader while using AoT compilation, Ionic or Electron , you must use an exported function instead of an inline function.

export function createTranslateLoader(http: HttpClient) {
    return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

@NgModule({
    imports: [
        BrowserModule,
        HttpClientModule,
        TranslateModule.forRoot({
            loader: {
                provide: TranslateLoader,
                useFactory: (createTranslateLoader),
                deps: [HttpClient]
            }
        })
    ],
    bootstrap: [AppComponent]
})
export class AppModule { }

If you used default TranslateHttpLoader for loader.useFactory , you see this error:

Answer 2

Its working now. The problem was I used the Http- Loader for ngx-translate which was not working in electron.

So I implemented the TranslateUniversalLoader like the last post of this thread mentioned: https://github.com/ngx-translate/core/issues/754