Не могу получить ngPlural для работы Angular

Question

Я пытаюсь заставить работать ngPlural, используя Angular версии 4.0.3, как указано в API: https://angular.io/api/common/NgPlural

<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>

Когда я использую [ngPlural] я получаю ошибку No provider TemplateRef! для шаблона ref. Если я удаляю его и использую *ngPlural, я также получаю сообщение об ошибке No provider for NgPlural!

Я не думаю, что мне нужно добавлять это как провайдера, так как это из Angular Common Library, такой как *ngIf и *ngFor, и они работают после подключения библиотеки commons.

Актуальны ли документы до версии 4.0.3?
Как я могу заставить это работать в моем шаблоне?

Обновить:

Я добавил плункер, чтобы продемонстрировать эту проблему: https://plnkr.co/edit/SQwRWjVEJjpQMVkWO1G4?p=preview

Answer 1

Вы можете использовать расширенную форму как:

<div [ngPlural]="value" class="testParent">
   <ng-template ngPluralCase="=0">
      <square class="testBox1"></square>
   </ng-template>
   <ng-template ngPluralCase="=1">
     111
   </ng-template>
</div>

Пример плунжера

или краткая форма:

{ value, plural, =0 {<square class="testBox1"></square>} =1 {111} }

Пример плунжера

Answer 2

Вы должны использовать ngPluralCase="" с ng-шаблоном.

Попробуй это:

 <square class="testBox1" [ngPlural]="value">
          <ng-template ngPluralCase="=0">case 0</ng-template>
      </square>