代码之家 › 专栏 › 技术社区 › santosh kumar patro

如何在使用typescript方法生成动态模板的情况下使用ngx翻译?

ngx-translate typescript angular

0

santosh kumar patro · 技术社区 · 7 年前

我在typescript文件中有以下方法,它生成具有不同文本内容的按钮的动态列表。我正在使用ngx翻译库来管理一个ng version=“4.4.7”的角度应用程序的翻译功能。在本例中,我想使用translate管道生成跨不同语言的翻译文本。

private getButtonTemplate(showLabel = true) {
    return `
      <button onclick="$onClick" data-social="$text" class="social-sharing-btn ${showLabel ? 'with-label' : ''}">
        <span class="icon icon_$text.toLowerCase()"></span>
        ${showLabel ? 'Share on $text' : ''}
      </button>
    `;
  }

我在翻译文件中有以下密钥:

en.json :
{
  "Share on Facebook": "Share on Facebook",
  "Share on Sina": "Share on Sina"
}

es.json :
{
  "Share on Facebook": "Compartir en Facebook",
  "Share on Sina": "Compartir en Sina"
}

在视图中,我们可以直接做如下所述:

测试{{'键'翻译}

有谁能帮我解决这个问题吗?

0 回复 | 直到 7 年前