【问题标题】:ngx-translate does not work properly even if i set translate.setDefaultLang('en')即使我设置了 translate.setDefaultLang('en'),ngx-translate 也无法正常工作
【发布时间】:2020-05-04 01:39:55
【问题描述】:

我的应用程序使用 faen 语言。有两个按钮应该在点击时改变方向和语言:setDir(code) 功能。单击按钮后,应用程序将被重新加载。语言和方向发生变化,但 ngx-translation 无法正常工作。它始终显示 fa.json 文件的值。即使我设置了translate.setDefaultLang('en')

app.component.ts

import { Component } from '@angular/core';
import { Platform, ModalController } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { Storage } from '@ionic/storage';
import { TranslateService } from '@ngx-translate/core';
export class MyApp {
  constructor(public platform: Platform, private storage: Storage,
translate: TranslateService, private modalController: ModalController,
statusBar: StatusBar) {
platform.ready().then(() => {
  statusBar.styleDefault();
  this.splash = modalController.create(SplashPage);
  this.splash.present();
});
translate.setDefaultLang('en');
storage.get('languageCode').then((lang) => {
  platform.setLang(lang, true);
  translate.use(lang);
});
this.storage.get('myDir').then((dir) => {
  platform.setDir(dir, true);
});
  }
  async setDir(code) {
    if (code === "fa") {
      await this.storage.set('myDir', 'rtl');
      await this.storage.set('languageCode', 'fa');
      window.location.reload();
    } else {
      await this.storage.set('myDir', 'ltr');
      await this.storage.set('languageCode', 'en');
      window.location.reload();
    }
  }
}

app.html

<ion-item text-end color="none" menuClose="" id="lis-sell" class="mymenu">
{{'simple_sale' | translate}}
</ion-item>

fa.json

{
"simple_sale": "فروش"
}

en.json

{
"simple_sale": "sale"
}

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { HttpClientModule, HttpClient } from '@angular/common/http';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
...
export function createTranslateLoader(http: HttpClient) {
return new TranslateHttpLoader(http, 'assets/i18n/', '.json');
}
@NgModule({
...
imports: [
BrowserModule,
HttpClientModule,
IonicModule.forRoot(MyApp),
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: (createTranslateLoader),
deps: [HttpClient]
}
}),
...

【问题讨论】:

  • 抱歉您对问题的解释不够清楚。尝试对其进行重构:首先详细描述目标用户体验(用户旅程),然后涵盖不适合您的内容。
  • @SergeyRudenko tnx 回复。我已经设法解决了我的存储问题,但我仍然无法使用 ngx-translate。我编辑了代码和解释。希望对您有所帮助

标签: angular typescript ionic3


【解决方案1】:

哇。我觉得很愚蠢。一切正常。它只是我定义了两个单独的菜单,并且我使用 ngx-translate 作为菜单中的值。一个菜单在 rtl 中工作。当应用程序将方向更改为 ltr 时,rtl 菜单将禁用并且 ltr 一个变为启用。所以问题完全出自我的愚蠢,我忘记了我有两个单独的菜单,而我只是为一个设置翻译值。

【讨论】:

    猜你喜欢
    • 2018-12-18
    • 2018-11-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-11-19
    • 1970-01-01
    相关资源
    最近更新 更多