angularjs-gettext：在占位符中翻译文本

Question

我正在使用插件angular-gettext，但我知道如何翻译占位符会遇到麻烦。这有效：

<input ng-model="application.lwsdegreeTitle" type="text" placeholder="Degree title" name="lwsappdegreetitle" id="lwsappdegreetitle" />

当我运行grunt时，字符串被添加到.POT文件中，我可以将其导出到en.po，...。

但我也有以下输入字段：

Degree title

正如您所看到的，我有一个带有文字的占位符：placeholder="{{ Degree title}}"。我已经尝试添加转换为输入字段的属性，但字符串不会插入.pot文件中。我也尝试了以下内容：

class A { this someMethod() { // code return this; } } class B extends A { } B b = new B(); B b2 = b.someMethod(); 但没有成功。我该如何解决这个问题？

Answer 1

从精美的文档中复制粘贴（不要太感谢我了; - ）

使用自定义注释

如果您发现自己必须始终翻译相同的属性，您可以告诉gettext将其作为翻译来提取。之后，由您决定如何翻译它。例如，如果您要在每个输入上翻译占位符属性，那么您可能会执行以下操作：

<input placeholder="{{ 'Input something here' | translate }}">

如果您想跳过必须为每个输入添加数据绑定和翻译过滤器，您可以在Grunt配置中将占位符指定为属性：

grunt.initConfig({   nggettext_extract: {
    pot: {
      options: {
        attributes: ['placeholder']
      },
      files: {
        'po/template.pot': ['src/views/*.html']
      }
    },   }, })

之后，您需要实现一个转换占位符属性的指令。这是一个简单的例子：

angular.module('myModule').directive('placeholder', ['gettextCatalog',
function(gettextCatalog){   return {
    restrict: 'A',
    link: function(scope, element, attrs){
      var translatedPlaceholder = gettextCatalog.getString(attrs.placeholder);
      element.attr('placeholder', translatedPlaceholder);
    }   }; }]);

最后，您可以像往常一样继续使用占位符属性：

<input placeholder="Input something here">

Answer 2

您可以使用ng-if =“false”添加新标签，只需在.pot文件中生成占位符字符串的条目：

<input type="text" placeholder="{{'Degree title'| translate}}" />
<label ng-if="false" translate>Degree title</label>

HTML输出：

.Pot文件输出：

msgid "Degree title" msgstr ""

运行nggettext_compile任务后，必须翻译占位符。

HTML输出：