I am about to implement Language Normalization with Lazy loading in my Ionic3 application. I am using the plugin ngx-translate
. But I am getting the error'TypeError: Cannot read property 'call' of undefined'. Please help me to solve this error
Code
1. app.module.ts
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { HttpClient } from "@angular/common/http";
export function createTranslateLoader(https: HttpClient) {
return new TranslateHttpLoader(https, './assets/i18n/', '.json');
}
@NgModule({
declarations: [
MyApp
],
imports: [
BrowserModule,
HttpModule,
IonicModule.forRoot(MyApp),
AngularFireModule.initializeApp(config),
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: (createTranslateLoader),
deps: [Http]
}
})
],
bootstrap: [IonicApp],
entryComponents: [
MyApp
],
providers: [
-------
]
})
export class AppModule { }
2. app.component.ts
ngOnInit(): void {
this.translate.addLangs(["en", "ml"]);
this.defaultLng = this.translate.setDefaultLang("ml");
this.translate.use(this.translate.getBrowserLang().match(/en|ml/) ? this.translate.getBrowserLang() : this.defaultLng);
}
3. login.module.ts
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { LoginPage } from './login';
import { Http } from '@angular/http';
import { TranslateModule } from '@ngx-translate/core';
@NgModule({
declarations: [
LoginPage,
],
imports: [
IonicPageModule.forChild(LoginPage),
TranslateModule.forChild()
],
})
export class LoginPageModule {}
4.login.html
<ion-item no-lines>
<span >{{'language'|translate}}:</span> <span (click)="changeLanguage('en')">english</span>
<span (click)="changeLanguage('sp')">Spanish</span>
</ion-item>
Please help me to solve the error