使用 I18Next 和 Aurelia 进行动态翻译

Question

我有一个正在与 I18Next 集成的 aurelia 应用程序，我的 Aurelia 集成工作正常并且一切顺利，直到我看到我们的菜单。对于正常的翻译，我们只是使用 html 属性，就像这样...

<a href="somelink" i18n="link1">Link 1</a>

然后在 translation.json 个文件中你有

{
  link1: "some translation here"
}

效果很好，翻译得很完美。我不知道的问题是如何处理动态的东西，比如我们的菜单。我们正在做一个 repeat.for 来制作菜单，但是我如何告诉 I18Next 使用 translations.json 文件中的哪个键？这是我的意思的一个简化示例。

<li repeat.for="item of router.navigation">
  <a href.bind="item.href" class="${item.isActive? 'is_active' : ''}>
    ${item.title}
  </a>
</li>

鉴于上面的布局，你怎么可能告诉 I18Next 使用什么键进行翻译，因为它是在循环中完成的。我尝试了几件事，但都失败了。我真的被困在这里，我需要使用 translation.json 文件来翻译它，但我不知道如何告诉它使用什么键进行翻译，是 "home"、"about", "contact", ...?任何帮助将非常感激。谢谢。

Answer 1

就像任何其他属性一样，您可以使用 aurelia 绑定到您的 i18n 属性。使用以下语法：

<a i18n.bind="'navigation.' + item.title"></a>

I18n 将在您的资源文件中查找名为 navigation.[item.title] 的键，因此如果 item.title 变量等于 "home"，它将查找名为 navigation.home.

使用 I18Next 和 Aurelia 进行动态翻译

dynamic translation with I18Next and Aurelia

javascript

i18next

aurelia