Ionic 3 with ngx-translate - Lazy loaded

Question

I'm trying to integrate the ngx-translate plugin into my Ionic 3 project with lazy loading. I've followed the guide on the Ionic Framework website.

The default language loads but using translate.use() has no effect at all.

I've posted the project on gitbub and any help would be greatly appreciated.

Here is the link to the repo: https://github.com/sumodevelopment/ngx-translate-test

Answer 1

Update your home.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { HomePage } from './home';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { Http} from '@angular/http';

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

@NgModule({
  declarations: [
    HomePage,
  ],
  imports: [
    IonicPageModule.forChild(HomePage),
    TranslateModule.forChild({
      loader: {
        provide: TranslateLoader,
        useFactory: (createTranslateLoader),
        deps: [Http]
      }
    })
  ],
  exports: [
    HomePage
  ]
})
export class HomePageModule {}

And there no need to use TranslateService Provider in your app.module.ts