import { Component } from '@angular/core';
import { WrPlural } from 'ngwr/pipes';
import { WrSlider } from 'ngwr/slider';
@Component({ imports: [WrPlural, WrSlider] })
export class MyComponent {}wrPlural
Pick the right word form for a count, in any language.
Installation
Import the class, and @use the entry point in your global styles: without it the component renders unstyled.
Live demo
Drag the count: English has two forms, Russian three.
Usage
Key the forms by CLDR category: zero, one, two, few, many, other. A missing form falls back to other.
{{ 1 | wrPlural: { one: 'comment', other: 'comments' } }}
<!-- "1 comment" -->
{{ 5 | wrPlural: { one: 'файл', few: 'файла', other: 'файлов' } : { locale: 'ru' } }}
<!-- "5 файлов" -->
{{ count() | wrPlural: forms : { includeValue: false } }}
<!-- word only -->API
| Name | Description | Type | Default |
|---|---|---|---|
wrPlural | Picks the word form through Intl.PluralRules. A missing form falls back to other. | (value: number | null | undefined, forms: WrPluralForms, options: WrPluralOptions = {}) => string | — |
options.includeValue | Print the count before the word. | boolean | true |
options.locale | Locale override; defaults to Angular's LOCALE_ID. | string | LOCALE_ID |