Question

我正在尝试使用Ionic2上的ng2-translate来执行多语言，我添加了button来更改Apps上setting page的语言1}}。基本上，更改语言的功能仅适用于设置页面，但其他页面不会发生任何事情。

我有一个愚蠢的方法来进行翻译，即在每个页面上添加一个改变当前页面语言的函数，当我点击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');
         }

  }

Answer 1

我有相同的设置页面来更改语言。

我在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 }}管道，当您选择另一种语言而不再进行更改时，它会更改翻译。

希望它可以帮到你

更改Ionic2上的语言 - 更改所有页面语言的最有效方法是什么？

1 个答案: