Comment utiliser angulaire 9 $ localiser avec des pluriels?

9

Depuis Angular 9, nous pouvons utiliser

$localize`Hello ${name}:name:`

Pour i18n en code tapuscrit. Cela a encore quelques limitations car la ng xi18ncommande ne détecte pas les chaînes, mais si ces textes sont ajoutés manuellement au fichier de traduction, cela fonctionne.

La $localizefonction est assez bien documentée dans le JSDoc dans la source , mais elle n'explique pas comment travailler avec des pluriels. Ce que je veux dire, c'est quelque chose comme ça (pseudo-code):

$localize`Hello {${count}, plural, =1 {reader} other {readers}}`

Est-ce possible avec $localize? Si oui: comment? Si non: comment Angular compile-t-il de telles expressions de HTML vers TypeScript?

angular angular-i18n yankee
la source
est-ce que cela vous aide <span i18n>Updated {minutes, plural, =0 {just now} =1 {one minute ago} other {{{minutes}} minutes ago}}</span>? C'est dans les documents. Assez similaire à ce que vous voulez
Dave Pastor
@DavePastor: Oui, j'ai essayé ça. J'ai changé cela dans la question maintenant. Néanmoins, c'est un pseudo-code, juste pour illustrer ce que je veux réaliser.
yankee
@DavePastor: (concernant le deuxième commentaire): Non, cela n'aide pas. C'est du HTML, pas du TypeScript.
yankee
Ok, donc vous voulez gérer cela du côté TS. Je l'ai.
Dave Pastor
Consultez ce blog.ninja-squad.com/2019/12/10/angular-localize
Dave Pastor

Réponses:

2

Pour l'instant, il n'est pas possible d'utiliser des ICU avec $localize, comme discuté dans ce numéro de github . D'après les derniers commentaires, il semble que l'équipe angulaire l'envisage si elle reste légère.

Pendant ce temps, la solution de contournement suggérée consiste à créer votre propre méthode d'assistance qui renvoie la traduction correcte en fonction du paramètre count.

    title = $localize `Hi ${this.name}! You have ${
        plural(this.users.length. {
          0: $localize `no users`,
          1: $localize `one user`,
          other: $localize`${this.users.length} users`,
    }.`

    function plural(value, options) {
      // Handle 0, 1, ... cases
      const directResult = options[value];
      if (directResult !== undefined) { return directResult; }
      // handle zero, one, two, few, many
      // ...
      return options.other;
    }
David
la source