NgPlural
directive
Adds / removes DOM sub-trees based on a numeric value. Tailored for pluralization.
ngPlural
number
addCase
void
@paramvalue
string
@paramswitchView
SwitchView
@returns
void
Description
Adds / removes DOM sub-trees based on a numeric value. Tailored for pluralization.
Displays DOM sub-trees that match the switch expression value, or failing that, DOM sub-trees that match the switch expression's pluralization category.
To use this directive you must provide a container element that sets the [ngPlural]
attribute
to a switch expression. Inner elements with a [ngPluralCase]
will display based on their
expression:
- if
[ngPluralCase]
is set to a value starting with=
, it will only display if the value matches the switch expression exactly, - otherwise, the view will be treated as a "category match", and will only display if exact value matches aren't found and the value maps to its category for the defined locale.
Exported by
Usage Notes
<some-element [ngPlural]="value"> <ng-template ngPluralCase="=0">there is nothing</ng-template> <ng-template ngPluralCase="=1">there is one</ng-template> <ng-template ngPluralCase="few">there are a few</ng-template></some-element>
Jump to details