ngx-translate与ts文件上的动态文本

Question

我正在使用ngx-translate在Ionic 3app 上进行国际化.我已经pipe很好地使用了HTML代码.但现在我有一个类似下面的情况ts.你能告诉我如何处理这种动态用例ngx吗？

 updateApi(topic) {
     this.showToast(`Topic ${topic.name} subscribed!`);//this is the dynamic text
  }

 showToast(message) {
        let toast = this.toastCtrl.create({
            message: message,
            duration: 3000
        });
        toast.present();
    }

这里的问题是我不知道${topic.name}前面的价值.所以,我怎么可以给key/value该上i18n json的文件吗？或者我在这里遗失了什么？

Answer 1

您必须在组件中注入Translate Service:

constructor(private translate: TranslateService) {}

并调用它,它将返回一个observable:

this.translate.get('TOPIC', {value: topic.name}).subscribe(res => {
      showToast(res);
});

在您的翻译文件中,您必须声明如下内容:

{
  "TOPIC": "Topic {{value}} subscribed!"
}

UPDATE

正如@Exari Constantin所说,您还可以使用TranslateService的即时方法以编程方式转换密钥.它看起来像这样:

showToast(this.translate.instant('TOPIC', {value: topic.name}));

Answer 2

你也可以这样做：

this.showToast(this.translate.instant('TOPIC', {value: ${topic.name}}));