NgPlural

Experimental Directive

What it does

Adds / removes DOM sub-trees based on a numeric value. Tailored for pluralization.

How to use

<some-element [ngPlural]="value">
  <ng-container *ngPluralCase="'=0'">there is nothing</ng-container>
  <ng-container *ngPluralCase="'=1'">there is one</ng-container>
  <ng-container *ngPluralCase="'few'">there are a few</ng-container>
  <ng-container *ngPluralCase="'other'">there are exactly #</ng-container>
</some-element>

Class Overview

class NgPlural {
  constructor(_localization: NgLocalization)
  
  
  ngPlural 
  addCase(value: string, switchView: SwitchView) : void
}

Selectors

[ngPlural]

Class Description

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.

See http://cldr.unicode.org/index/cldr-spec/plural-rules

Constructor

constructor(_localization: NgLocalization)

Class Details

ngPlural
addCase(value: string, switchView: SwitchView) : void

exported from @angular/common/index, defined in @angular/common/src/directives/ng_plural.ts

doc_Angular
2016-10-06 09:46:46
Comments
Leave a Comment

Please login to continue.