如何在angular中使用@ngx-translate转换对象



我有一个对象用两种语言:西班牙语和英语我可以翻译对象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;

我必须检测在选择{{语言}}的变化,我尝试与onChanges,但不工作,以及与ChangeDetectorRef....

问题在于您的switchLang函数,该函数检查所选语言,而不可能使用this.translate.use函数。

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

所以如果你想正确检查它,你必须使用this.translate.currentLanglanguage参数在你的情况下。

尝试以下操作:

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

注意:没有必要为每种语言使用两个键,您只能在两个语言翻译文件中使用相同的键,然后使用translate管道根据currentLang获得适当的值。

最新更新