2017-04-27 103 views
0

我使用的是Ionic框架v3.0.1,我一直沿着这个tutto https://javebratt.com/angular-translate-ionic/一步一步在主页上正常工作。Angular with ng2-translate只适用于主页

但我创建了第二个,当我尝试在构造函数中设置语言时,我无法访问在主页选择的语言(当前语言未定义)。这里是我的代码:

app.module.ts

import { TranslateService, TranslateModule, TranslateStaticLoader, TranslateLoader } from 'ng2-translate/ng2-translate'; 
import { MyApp } from './app.component'; 
import { HomePage } from '../pages/home/home'; 
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular'; 


@NgModule({ 
declarations: [ 
MyApp, 
HomePage  
], 
imports: [ 
    IonicModule.forRoot(MyApp), 
    TranslateModule.forRoot({ 
    provide: TranslateLoader, 
    useFactory: (createTranslateLoader), 
    deps: [Http] 
}) 
], 
bootstrap: [IonicApp], 
entryComponents: [ 
MyApp, 
HomePage 
], 
providers: [ 
{provide: ErrorHandler, useClass: IonicErrorHandler} 
] 
}) 
export class AppModule {} 

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

app.component.ts

import { Component } from '@angular/core'; 
import { Platform } from 'ionic-angular'; 
import { TranslateService } from 'ng2-translate'; 
import { HomePage } from '../pages/home/home'; 

@Component({ 
    templateUrl: 'app.html' 
}) 
export class MyApp { 
    rootPage:any = HomePage; 

    constructor(platform: Platform, translate: TranslateService) { 
    translate.setDefaultLang('es'); 
    } 
} 

home.ts(这里我选择的语言)

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { Http } from '@angular/http'; 
import 'rxjs/add/operator/map'; 
import { TranslateService } from 'ng2-translate'; 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 

    public items : any = []; 
    constructor(public navCtrl: NavController, 
       public http : Http, public translateService: TranslateService) {     
    } 

    // Allow navigation to the userSignUp page for creating a new entry 
    addEntry() 
    { 
     this.navCtrl.push('UserSignUp'); 
    } 


    // Allow navigation to the userSignUp page for amending an existing entry 
    viewEntry(param) 
    { 
     this.navCtrl.push('UserSignUp', param); 
    } 

    //Translation functions 
    translateToSpanish(){ 
    this.translateService.use('es'); 
    } 

    translateToEnglish(){ 
    this.translateService.use('en'); 
    } 
} 

用户-sign-up.ts(我想设置之前在家中选择的语言)

import { Component } from '@angular/core'; 
import { IonicPage, NavController, NavParams, ToastController } from 'ionic-angular'; 
import { FormGroup, Validators, FormBuilder } from '@angular/forms'; 
import { Http, Headers, RequestOptions } from '@angular/http'; 
import 'rxjs/add/operator/map'; 
import { TranslateService } from 'ng2-translate'; 

@IonicPage() 
@Component({ 
    selector: 'page-user-sign-up', 
    templateUrl: 'user-sign-up.html' 
}) 
export class UserSignUp { 

    // Initialise module classes 
    constructor(public translateService: TranslateService) 
    {   
     translateService.use(translateService.currentLang);   
    } 
} 

用户登录up.module.ts

import { NgModule } from '@angular/core'; 
import { IonicPageModule } from 'ionic-angular'; 
import { UserSignUp } from './user-sign-up'; 
import { TranslateModule, TranslateStaticLoader, TranslateLoader } from 'ng2-translate/ng2-translate'; 
import { Http } from '@angular/http'; 

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

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

回答

0

改为NGX-翻译和添加到您需要使用翻译管TranslateModule.forChild()任何module.ts和工作正常