Angular ngSwitch

website creator html:

<ng-container [ngSwitch]="dietSelection">

  <ng-container *ngSwitchCase="'veg'">Vegetarian</ng-container>

  <ng-container *ngSwitchCase="'spicy'">Spicy</ng-container>

  <ng-container *ngSwitchDefault>Standard diet</ng-container>

</ng-container>

Multiple switch cases with the same output:

<ng-container [ngSwitch]="dietSelection">

  <ng-container *ngSwitchCase="'veg'">

    <ng-container *ngTemplateOutlet="vegTemplateRef"></ng-container>

  </ng-container>

  <ng-container *ngSwitchCase="'vegan'">

    <ng-container *ngTemplateOutlet="vegTemplateRef"></ng-container>

  </ng-container>

  <ng-container *ngSwitchCase="'spicy'">Spicy</ng-container>

  <ng-container *ngSwitchDefault>Standard diet</ng-container>



  <ng-template #vegTemplateRef>Vegetarian or vegan</ng-template>

</ng-container>