Angular 7 ngx-translate刷新后不記得該語言

Question

我們有一個Angular應用程序，它有兩種語言。 默認為德語，另一個為英語。 我們正在使用ngx-translate作為translateService 。

刷新瀏覽器時，應用程序將切換回默認語言。

swithLang()函數在我們的導航欄中被調用：

<li class="nav-item">
    <a class="nav-link" id="switchLang" (click)="switchLang()">
      <span>
        <i class="fa fa-globe" aria-hidden="true"></i>
        <span>{{'switch-lang' | translate}}</span>
      </span>
    </a>
</li>

component.ts：

switchLang() {
    this.languageService.switchLanguage();
}

和語言服務 ：

import { Injectable } from '@angular/core';
import {TranslateService} from '@ngx-translate/core';

@Injectable({ providedIn: 'root' })
export class LanguageService {

  private language = 'de';

  constructor(private translateService: TranslateService) { }

  getCurrentLanguage() {
    return this.language;
  }

  getLocale() {
    if (this.language === 'en') {
      return 'en_US';
    } else {
      return 'de_DE';
    }
  }

  switchLanguage() {
    if (this.language === 'en') {
      this.language = 'de';
    } else {
      this.language = 'en';
    }
    this.translateService.use(this.language);
  }
}

translateService是ngx-translate 。

Answer 1

這是正確的行為。 您可以使用localStorage（或其他位置）來存儲所選的語言。

Answer 2

您可以使用localStorage將值存儲在設備內存中，以下是示例

 // function select language
  selectLanguage(i: number) {
    this.lag = this.languages[i];
    this.translateService.use(this.languages[i].title.toLowerCase());
    localStorage.setItem("language",this.languages[i].title.toLowerCase());
  }

Answer 3

Angular服務完全存在於內存中。 如果要添加持久性，則應在更改語言時將當前值保存到localStorage或將此設置保存到服務器