在Ionic2上更改語言 - 更改所有頁面語言的最有效方法是什麼？

我想在Ionic2上使用ng2-translate來執行多語言，並且我在setting page上添加了一個button用於更改Apps的語言。基本上，改變語言的功能只在設置頁面上工作，但其他頁面不會發生任何事情。在Ionic2上更改語言 - 更改所有頁面語言的最有效方法是什麼？

而且我有一個愚蠢的方法來做翻譯，那就是添加一個函數，它會在每個頁面上改變當前頁面的語言，當我點擊setting page上的按鈕時它會被執行。

但是這個解決方案效率較低，怎麼能以一種有效的方式做同樣的事情呢？

這裏是我的代碼的一部分：

設置頁面：

import { Component, ViewChild } from '@angular/core'; 

    import { NavController, List } from 'ionic-angular'; 
    import {TranslateService, TranslatePipe, TranslateLoader, TranslateStaticLoader} from 'ng2-translate/ng2-translate'; 
    @Component({ 
     selector: 'page-setting', 
     templateUrl: 'setting.html' 
    }) 

    export class SettingPage { 
     translate; 
    @ViewChild(List) list: List; 
    constructor(public navCtrl: NavController, translate: TranslateService) { 
      translate.setDefaultLang('zh'); 
      this.translate = translate; 
     } 
     //When the translation button is clicked 
     click() { 
      this.translate.use('en'); 
       //Change all the pages language 
       location.change('en');`enter code here` 
       home.change('en'); 
     } 

    }

來源

2017-02-22 Capslock10

我有同樣的，一個設置頁來改變語言。

我有這樣的HTML：

<ion-item> 
    <ion-label class="primary-text-color">{{ 'Settings.settings.language' | translate }}</ion-label> 
    <ion-select [(ngModel)]="language" (ionChange)="onChange($event)"> 
    <ion-option value="es">Español</ion-option> 
    <ion-option value="en">English</ion-option> 
    </ion-select> 
</ion-item>

然後在我的TS文件：

import { TranslateService } from 'ng2-translate'; 

[...] 

language: String; 

constructor(public translate: TranslateService) { 
    this.language = translate.currentLang; 
    this.usermail = this.userdata.getEmail(); 
} 

onChange(e) { 
    this.translate.use(e); 
}

這將改變你的語言中的所有頁面，只需使用{{ 'Settings.info.mail' | translate }}管，它會改變翻譯當你選擇另一種語言時沒有更多的變化。

希望它可以幫助你

來源

2017-02-22 09:35:32

感謝您的回覆。我試圖使用你的代碼，但它不適用於我。它是我的構造函數錯誤嗎？ – Capslock10

我發現了這個問題。其他頁面中的構造函數不應該有任何'TranslateService參數。我刪除了其他頁面中的所有TranslateService，現在它工作得很好。非常感謝。 – Capslock10

在Ionic2上更改語言 - 更改所有頁面語言的最有效方法是什麼？

回答

相關問題