4

I am following the Angular i18n guide: https://angular.io/guide/i18n

I got how to interpolate correctly a "String + Variable".

<trans-unit id="interpolated-persons" datatype="html">
        <source>Persons: <x id="INTERPOLATION" equiv-text="{{number-of-people}}"/></source>
        <target>Personas: <x id="INTERPOLATION" equiv-text="{{number-of-people}}"/></target>
</trans-unit>

<span i18n="@@interpolated-persons">Persons: {{persons}}</span>

However, I don't get how to interpolate a "String + Plural".

<trans-unit id="interpolated-time" datatype="html">
        <source>Time: <x id="ICU" equiv-text="{tempo, plural, other {...}}"/></source>
        <target>Tiempo: {tempo, plural, =60 {una hora} =1440 {un día} =10080 {una semana} other {mucho tiempo}}</target>
</trans-unit>

<span i18n="@@interpolated-time">Time: {minutes, plural, other {{{minutes}} elapsed}}</span><br>

I have tried several things. The only way I made it work was changing tempo by a hardcoded value or the minutes variable directly in the <target>. However, if I do that I won't be able to reuse the same translation in another page.

Is it possible to interpolate a String + Plural?

Andrés Oviedo
  • 1,388
  • 1
  • 13
  • 28

1 Answers1

4

Angular splits "String + Plural" expression in 2 simpler expressions.

The plural inner expression gets a random identifier and it should match the trans-unit "id" in the messages.xlf file in order to work.

The exact Translate a nested expression example in https://angular.io/guide/i18n should be like this:

<trans-unit id="interpolated-time" datatype="html">
    <source>Updated: <x id="ICU" equiv-text="{minutes, plural, =0 {...} =1 {...} other {...}}"/></source>
    <target>Actualizado: <x id="ICU" equiv-text="{minutes, plural, =0 {...} =1 {...} other {...}}"/></target>
  </trans-unit>
  <trans-unit id="7151c2e67748b726f0864fc443861d45df21d706" datatype="html">
    <source>{VAR_PLURAL, plural, =0 {just now} =1 {one minute ago} other {<x id="INTERPOLATION" equiv-text="{{minutes}}"/> minutes ago by {VAR_SELECT, select, male {male} female {female} other {other} }} }</source>
    <target>{VAR_PLURAL, plural, =0 {justo ahora} =1 {hace 1 minuto} other {hace <x id="INTERPOLATION" equiv-text="{{minutes}}"/> minutos por {VAR_SELECT, select, male {un hombre} female {una dama} other {otro} }} }</target>
  </trans-unit>

The id 7151c2e67748b726f0864fc443861d45df21d706 should be obtained from compilation output:

Missing translation for message "7151c2e67748b726f0864fc443861d45df21d706"
Andrés Oviedo
  • 1,388
  • 1
  • 13
  • 28
  • 1
    I am having the similar issue. Why id needs to be taken from compilation output? id won't change everytime? – Hary Jun 22 '20 at 14:55
  • @Hary ID will be assigned automatically because there is no way to specify it manually. Please [upvote](https://github.com/angular/angular/issues/26379) the corresponding Angular issue by registering / signing in on GitHub and then clicking the "" icon at the bottom of the first post. – izogfif Jun 17 '22 at 12:43