注意:我厌倦了与该主题相关的所有问题和答案。
我想在更改语言 Dropdown 时翻译 Typescript 变量值而不刷新页面。
我试图改变语言方面的数据变化。我成功更改HTML Bind:
下拉值更改但不更新TypeScript Bind:
值的值。
我使用ngx 翻译
我推荐链接:但没有成功
- angular-ngx-translate-在打字稿中的用法
- ngx-translate-in-ts-file-angular
- ngx-translate-with-dynamic-text-on-ts-file
components.ts
import { Component, OnInit } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
@Component({
selector: 'app-translate',
templateUrl: './translate.component.html',
styleUrls: ['./translate.component.css']
})
export class TranslateComponent implements OnInit {
typeScriptvalue: string;
simpleProducts:any[]=[ {
name:'English',
id:'en'
},
{
name:'French',
id:'fr'
}];
constructor(private translate: TranslateService) {
this.typeScriptvalue = this.translate.instant('HOME.TITLE');
}
ngOnInit(): void {
}
changeevent(e)
{
console.log(e);
this.translate.use(e.value);
}
}
component.html
<label><b> HTML Bind</b></label> : <div>{{ 'HOME.TITLE' | translate }}</div> <br>
<label><b>TypeScript Bind</b></label> : <div>{{ typeScriptvalue }}</div> <br>
<label>
Change language : <div class="dx-field-value">
<dx-select-box [dataSource]="simpleProducts" displayExpr="name" valueExpr="id" (onValueChanged)="changeevent($event)"></dx-select-box>
</div>
</label>