2017-04-27 61 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和工作正常