如何使用 angular-translate 从 HTML 中的函数获取翻译 ID

Question

我有一个 ng-repeat 放置一些带有数组标题的图像：

<span ng-repeat="foo in bar">                   
   <p ng-click="myFunction(foo)" ng-init="imgsrc=foo.image">                                                    
      <img ng-src="{{imgsrc}}" style="cursor: pointer; cursor: hand"/>
      <br />
      <span >My Caption</span>                                                                                  
   </p>     
</span>

这非常有效，但现在我想根据当前语言更改每张图片的标题。我有 angular-translate 像这样工作：

<div translate>MY_TRANSLATION_ID</div>

但现在我需要在循环中从 foo object 中获取翻译 ID。我试过了：

• <span translate>{{foo.translationID}}</span>
• <span translate>foo.translationID</span>
• 正在创建一个将 return 翻译 ID 的函数：
  <span ng-init="text=myTranslate(foo)">{{text}}</span>

但没有任何效果。这可能吗？我试图避免将翻译后的字符串直接保存在我的 foo object 中，因为我正在使用异步加载并且我正在动态更改语言所以这不是那么容易或者我无法得到它工作正常（也按照建议 here 我应该在我的 HTML 代码中进行翻译）

Answer 1

您可以使用 translate 过滤器：

<span>{{ foo.translationID | translate }}</span>