我正在使用这个 @ngx-translate/core i18n 服务，它在模板 (.html) 中使用以下语法运行良好：
{{'my.i18n.key'|translate}}
现在我想在我的组件打字稿文件 (.ts) 中翻译一些东西，但我不知道如何使用它。
我可以在我的构造函数中创建翻译对象：
构造函数（私有翻译：TranslateService）{}
现在如何翻译“my.i18n.key”？
【问题讨论】：
标签： angular typescript ngx-translate
要翻译打字稿文件中的内容，请执行以下操作
constructor(private translate: TranslateService) {}
然后在需要翻译的地方这样使用
this.translate.instant('my.i18n.key')
【讨论】：
/** * Returns a translation instantly from the internal state of loaded translation. * All rules regarding the current language, the preferred language of even fallback languages will be used except any promise handling. */
来自github上的文档：
get(key: string|Array, interpolateParams?: Object): Observable：获取键（或 键数组）或键（如果找不到值）
试试你的控制器/类：
constructor(private translate: TranslateService) {
let foo:string = this.translate.get('myKey');
}
【讨论】：
constructor(private translate: TranslateService) { let foo:string = this.translate.stream('myKey'); }
stream 可以帮助我实时更新语言更改的文本，而instant 和订阅get 只会触发一次。
要翻译 Typscript 文件，请遵循代码
在标题中导入
import { TranslateService } from '@ngx-translate/core';
在构造函数中声明为
public translate: TranslateService
假设 JSON 文件如下所示
{
"menu":{
"Home": "Accueil"
}
}
在构造函数中声明以下代码。
注意：Key 代表您在 language.json 文件中使用的主键值（这里是“菜单”）
this.translate.get('menu').subscribe((data:any)=> {
console.log(data);
});
【讨论】：
我正在使用 angular 8 > 在我的例子中 > 如果你想将 typescript 字符串翻译成另一种语言，那么使用这个 > 首先，制作一个服务文件来获取翻译值，下面是我的 globaltranslate.service.ts 文件代码
import { Injectable } from '@angular/core';
import {TranslateService} from '@ngx-translate/core';
constructor(public translate: TranslateService) {}
然后做一个返回函数…………
getTranslation(str) {
const currentLang = this.translate.currentLang; // get current language
const returnValue = this.translate.translations[currentLang][str]; // get converted string from current language
if (returnValue === undefined) {
return this.translate.translations.en_merch[str]; // if value is getting undefined then return default language string, en_merch is default english language file here
} else {
return returnValue;
}
}
并且在component.ts文件中，你可以导入服务文件并像下面的代码一样使用它...
import {GlobaltranslateService} from '../../../../services/globaltranslate.service';
@Component({
selector: 'app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
providers: [GlobaltranslateService] // add service in provider
})
constructor(
private gTranslate: GlobaltranslateService // add service into constructor
) {}
const title = this.gTranslate.getTranslation('Title text'); // get return value by calling function 'getTranslation' in globaltranslateservice.
这个方案更适合i18n和angular ngx translate
的所有项目这也适用于 sweetalert2 字符串，如以下代码
Swal (
this.gTranslate.getTranslation('Warning'),
data.message,
'warning'
);
感谢阅读，如有疑问请留言。
【讨论】：
我不知道问题是否出在何时发布，但是将“get”方法分配给一个变量以获取翻译后的字符串是行不通的，因为它返回一个 observable
get 应该这样使用：
constructor(private translate: TranslateService) { }
:
:
this.translate.get ('KEY_TO_TRANSLATE').subscribe (x=> this.translation = x);
要获取字符串，您可以使用 Instant 方法：
this.translation = this.translate.instant('KEY_TO_TRANSLATE')
但是，这是一种同步方法，因此如果尚未加载翻译，您将获得键，而不是值。这一切都在 the documentation 中进行了解释，可以在 Github 中找到。
【讨论】：
这对我有用（我使用的是 Angular 7）。 只需在构造函数上导入 Translate 服务，然后从 myfunction 内部调用它，如下所示：
getTranslation(){
let translation = "";
let clientTranslation = this.translate.get('auth.client').subscribe(cliente =>{
translation = cliente;
document.getElementById("clientTest").setAttribute('value', translation);
}
}
我在表单上使用了翻译，所以我将它传递给输入 setAttribute，希望这个例子能有所帮助。
【讨论】：
您可以使用 translate.instant() 方法并传递存储在 i18n 文件中的密钥名称。例如：
translate.instant('hello');
如果是来自参数或变量，则直接传递值。
translate.instant(my.i18n.key);
你也可以参考这个答案： https://github.com/ngx-translate/core/issues/835#issuecomment-384188498
【讨论】：
errorMessage:string="";
constructor(
protected translate:TranslateService,
) {
}
ngOnInit(): void {
this.translate.get('PLEASE_ENTER_OTP').subscribe(data=>{
this.errorMessage=data;
})
}
你可以在ngOninit订阅observable
【讨论】：