Question

我正在开发一个AngularJs项目，我正在使用以下方式使用translate过滤器：

<h2>{{'This is my text' | translate}}</h2>

它工作正常，但我希望能够在我的翻译中使用变量。这是我尝试过的：

在控制器中：

vm.text = "This {{toReplace}} is a variable.";
vm.myVariable = "random value";

在html中：

<h2>{{vm.text | translate:'{ toReplace: vm.myVariable }'}}</h2>

它不会将{{toReplace}}替换为myVariable的内容。相反，该页面显示“此{{toReplace}}是一个变量。”

我该怎么做才能使这项工作？

Answer 1

您是否尝试过该指令而不是过滤器？像这样：

<h2 translate="vm.text" translate-values={'toReplace':vm.myVariable}"></h2>

Answer 2

vm.text必须包含有效的翻译密钥，您应在语言文件中定义该密钥。 translate键的值为"This {{toReplace}} is a variable."。然后你的HTML应该正确呈现。

如果您只想在没有国际化支持的情况下呈现此文本，您可以这样做：

<h2>This {{vm.toReplace}} is a variable.</h2>

Answer 3

这个解决方案对我有用，考虑到myVariable＆＃39;是我的控制器中定义的变量：

<h2 data-translate>This {{vm.myVariable}} is a variable</h2>

棘手的部分是，就像使用翻译过滤器一样，元素中的文本不是要显示的文本，而是要翻译的元素的ID。在翻译文件（po）中，您必须拥有一个ID为＃39的元素;此{{vm.myVariable}}是一个变量＆＃39;，包括变量的名称。如果您需要显示相同的文本但数据来自不同的变量，则必须使用自己的ID声明不同的翻译，即使只有文本的可变部分不同。

例如，这必须是翻译文件中的不同条目：

<h2 data-translate>This {{vm.myVariable2}} is a variable</h2>

在AngularJs中使用带有translate过滤器的变量

3 个答案: