ngx-translate：翻译 html 中的字符串

Question

我在 angular 应用程序中使用 ngx-translate 库来支持 I18N。谁能帮我标记下面的 html 片段进行翻译？

<span *ngIf="Days < 0 && !shortSentence">
      Follow-up is <span [class.font-bold]="highlightContent">{{ InDays | positiveNumber }} days</span> past due
    </span>

我只想标记span标签内的文本内容。我怎样才能把它变成参数化的翻译？

任何帮助将不胜感激。

提前致谢。

Answer 1

您可以通过以下方式使用带过滤器的参数化翻译：

// define translation with parameter
'TRANSLATION_KEY': '{{days}} days'

// use it in template
<span>{{ 'TRANSLATION_KEY' | translate: { days: followUpInDays | positiveNumber } }}</span>

如果你想将整个句子作为翻译（包括HTML），你将需要使用innerHTML 属性绑定：

// define translation with parameter
'TRANSLATION_KEY': 'Follow-up is <span class="{{className}}">{{days}} days</span> past due'

// use it in template
<span *ngIf="Days < 0 && !shortSentence"
      [innerHTML]="'TRANSLATION_KEY' | translate: { className: (highlightContent ? 'font-bold' : ''), days: followUpInDays | positiveNumber }">
</span>

ngx-translate：翻译 html 中的字符串

ngx-translate: Translate strings in html

angular-i18n

ngx-translate

angular