i18n关于在Angular 7中具有复数/选择的属性

Question

简短问题

我可以有一个占位符文本根据组件状态变化的输入元素吗？

更长的问题

Angular可以通过以下语法示例添加i18n：

<input i18n-placeholder placeholder="default placeholder" />

还可以通过以下语法示例添加复数规则：

<span i18n>
    Updated {minutes, plural, =0 {just now} =1 {one minute ago} other {{{minutes}} minutes ago}}
</span>

我试图合并这两个功能，以便占位符的文本根据组件的状态而变化。组件模板包含以下html：

<input i18n-placeholder placeholder="Add {stuff.length, plural, =0 {} other {more}} stuff..." />

我希望占位符在单数情况下说Add stuff...，在复数情况下说Add more stuff...，但是在占位符中得到的只是Add。

是否可以在不复制元素和使用*ngIf的情况下获取html属性中的复数i18n？

Here's a stackblitz with a working example

Answer 1

这实际上与i18n无关。它仅表明Angular似乎无法正确解析和处理属性内的复数表达式。

(relatively dirty) workaround就是将表达式简单地放在一个不可见的DOM节点（例如模板）中，以将该dom节点放置在该dom节点中，然后将该DOM节点的文本插入占位符内：

<input #myInput [placeholder]="ph.innerText">

<template #ph i18n>Add {stuff.length, plural, =0 {} other {more}} stuff...</template>

Answer 2

使用i18nPlural管道有一个解决方案。

<input placeholder="{{ stuff.length | i18nPlural : {
    '=0': 'No stuff.',
    '=1': 'One stuff.',
    'other': '# stuff.'} }}">