ngx-translate 无需刷新页面即可翻译 Angular 应用程序以从 BE 获取所有数据

问题描述

如何使用 ngx-translate 翻译 Angular 应用程序而不刷新页面以使用新的语言标题再次从 BE 获取所有数据？

解决方法

使用 TranslatePipe 或 TranslateDirective 获取翻译值。

喜欢：<div [translate]="'HELLO'" [translateParams]="{value: 'world'}"></div>

或：<p>{{ 'ROLES.' + role | uppercase | translate }}</p>

如果您在 component.ts 中获得翻译并且不想刷新，则必须使用 observables 来获取更改：

translate.get('HELLO',{value: 'world'}).subscribe((res: string) => {
    console.log(res);
    //=> 'hello world'
});