我如何使用@ngx-translate 以角度翻译对象答案

【问题标题】：how I can translate an object in angular using @ngx-translate我如何使用@ngx-translate 以角度翻译对象
【发布时间】：2021-09-11 23:18:17
【问题描述】：

我有两种语言的对象：西班牙语和英语我可以翻译对象 1 次，默认情况下它是英语，我可以从英语翻译成西班牙语，但后来我不能再翻译成英语等....

room.component.html

<ul class="navbar-nav  navbar-right">
                <span class="form-inline">
                    <select 
                        class="form-control" 
                        #selectedLang 
                        (change)="switchLang(selectedLang.value)">
                      <option *ngFor="let language of translate.getLangs()" 
                        [value]="language"
                        [selected]="language === translate.currentLang">
                        {{ language }}
                      </option>
                    </select>
                  </span>

            </ul>

      <div *ngIf="translateEn == true; then thenBlock else elseBlock"></div>
<ng-template #thenBlock>     <h4>{{ room.titleEs }}</h4></ng-template>
<ng-template #elseBlock> <h4>{{ room.title }}</h4></ng-template>

room.component.ts

 switchLang(language: string) {
    this.translate.use(language);
   // this.cdRef.markForCheck();
  //  this.cdRef.detectChanges();
    if(this.translate.use('en'))
    {
      this.translateEn = true;
    }
    else if(this.translate.use('es'))
    {
      this.translateEn = false;
    }

 translate.addLangs(['en', 'es']);
    translate.setDefaultLang('en');

  public translateEn:boolean;

我必须检测 select {{ language }} 中的更改，我尝试使用 onChanges 但不起作用，并且使用 ChangeDetectorRef....

【问题讨论】：

标签： angular ngx-translate

【解决方案1】：

问题出在您的 switchLang 函数中，它检查所选语言可能不是使用 this.translate.use 函数。

this.translate.use 用于更改语言，而不是检查选择了哪个语言，无论如何它返回一个可观察的而不是布尔值。

因此，如果您想正确检查它，您必须使用this.translate.currentLang 或在您的情况下仅使用language 参数。

尝试以下方法：

switchLang(language: string) {
    this.translate.use(language);
    this.translateEn = language === 'en';
}

注意：没有必要为每种语言使用两个key，只能在两个语言翻译文件中使用相同的key，然后使用translate管道获取正确的值基于currentLang。

【讨论】：