В чем разница между ngSwitch и ngPlural - Angular

Question

Я просмотрел Angular документацию и не могу найти разницу между ними. Я переключил их в этом примере: https://stackblitz.com/edit/ngplural и получил тот же результат

Answer 1

ngSwitch условно добавляет / удаляет элементы DOM в зависимости от любого значения (строка, число, логическое значение) ngSwitch: любой

ngPlural условно добавляет / удаляет поддеревья DOM в зависимости от числа c только значение ngPlural: число ;

Html file

<p>
 I have {{count1}} items, but I could also say 

 <span [ngSwitch]="count1">
 <ng-template ngSwitchCase="zero">there are no items.</ng-template>
 <ng-template ngSwitchCase="one">there is one item.</ng-template>
 <ng-template ngSwitchCase="2">there are four items.</ng-template>
 <ng-template ngSwitchCase="many">there are many items.</ng-template>
 <ng-template ngSwitchCase="other">there are some items.</ng-template>
 </span>
</p>

<p>
 I have {{count}} items, but I could also say 

 <span [ngPlural]="count">
 <ng-template ngPluralCase="zero">there are no items.</ng-template>
 <ng-template ngPluralCase="one">there is one item.</ng-template>
 <ng-template ngPluralCase="2">there are four items.</ng-template>
 <ng-template ngPluralCase="many">there are many items.</ng-template>
 <ng-template ngPluralCase="other">there are some items.</ng-template>
 </span>
</p>

ts.file

export class AppComponent {
  count = "zero" // ngPlural when I give string values it goes to default statement
  count1 = "one" // ngSwitch works here perfectly
}

Answer 2

ngSwitch условно добавляет / удаляет элементы DOM в зависимости от логическое (выражение) значение

ngPlural условно добавляет / удаляет поддеревья DOM в зависимости от цифра c значение