Question

How do you handle Pluralization?

Answer 1

You can translate with pluralization by defining the locale that have a pipe | separator, and define plurals in pipe separator. Remember that template should use $tc() instead of $t().

First you need to define the messages,

const messages = {
  en: {
    user: 'user | users',
    friend: 'no friend | one friend | {count} friends'
  }
}

And the template can configure the messages with values

<p>{{ $tc('user', 1) }}</p>
<p>{{ $tc('user', 10) }}</p>

<p>{{ $tc('friend', 0) }}</p>
<p>{{ $tc('friend', 1) }}</p>
<p>{{ $tc('friend', 10, { count: 10 }) }}</p>

Finally it outputs the result as below

<p>user</p>
<p>users</p>

<p>no friend</p>
<p>one friend</p>
<p>10 friends</p>