Question

我有多语言服务。

    import {Injectable, Inject} from '@angular/core';
import { TRANSLATIONS } from './translations'; // import our opaque token

@Injectable()
export class TranslateService {
  private _currentLang: string;

  public get currentLang() {
    return this._currentLang;
  }

  // inject our translations
  constructor(@Inject(TRANSLATIONS) private _translations: any) {
  }

  public use(lang: string): void {
    // set current language
    this._currentLang = lang;
  }

  private translate(key: string): string {
    // private perform translation
    let translation = key;

    if (this._translations[this.currentLang] && this._translations[this.currentLang][key]) {
      return this._translations[this.currentLang][key];
    }

    return translation;
  }

  public instant(key: string) {
    // public perform translation
    return this.translate(key);
  }
}

所以，这适用于我选择的组件。但是在转到另一个组件并返回后，语言被设置为默认值。

或许还记得localStorage中选择的语言吗？有人知道如何记住选定的语言吗？

Answer 1

你的设置看起来像我的小项目，所以我在这里走出困境。如果这是正确的，请在您的问题中添加组件中的基本代码，以便其他用户可以理解:)

但是在您的翻译服务中，您可以设置当前语言，可以从您提供的代码中看到：

  public get currentLang() {
    return this._currentLang;
  }

然后在组件中注入此服务，我将其命名为_translateService因此，只需在OnInit方法中检查当前选择的语言即可。看起来应该是这样的：

this.selectLang(this._translateService._currentLang);

selectLang方法，当用户选择语言选项时也会触发该方法。

selectLang(lang: string) {
    this._translateService._currentLang = lang; // if user makes choice on some component, the new chosen language is pushed to service
    this._translateService.use(lang); // the method in your service
    this.refreshText(); // method that updates the content to current language
}

希望这有帮助，如上所述，添加selectLang - 方法（或类似名称），以防您在应用中使用过类似的内容。作为参考，这是我使用的例子，我怀疑你也有：

angular2多语言实现

1 个答案:

Simple language translation