ngx-translate与ts文件上的动态文本 [英] ngx-translate with dynamic text on ts file

问题描述

我正在使用 ngx-translate 用于 Ionic 3 app的国际化。我在 HTML 代码上使用了 pipe 。但现在我在 ts 文件中遇到如下情况。你能告诉我如何使用 ngx 处理这种动态用例吗？

I'm using ngx-translate for internationalization on Ionic 3 app. I have used pipe nicely on HTML code. But now I have a situation like below on ts file. Can you tell me how to handle such dynamic use case with 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();
    }

这里的问题是我不知道<$ c $的价值预先c> $ {topic.name} 。那么如何在 i18n json 键提供键/值 $ c>档案？还是我错过了什么？

The problem here is I don't know the value of ${topic.name} up front. So how can I give the key/value for that on i18n json file? or am I missing something here?

推荐答案

您必须在组件中注入翻译服务：

You have to inject the Translate Service in your component :

constructor(private translate: TranslateService) {}

并制作对它的调用，它将返回一个observable：

And make a call to it, it will return an observable :

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

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

In your translation file you have to declare something like this :

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

这篇关于ngx-translate与ts文件上的动态文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！