ngSwitch directive
NgSwitch
is like the JavaScript switch
statement. It can display one element from among several possible elements, based on a switch
condition. Angular puts only the selected element into the DOM.
NgSwitch
is actually a set of three, cooperating directives: NgSwitch
, NgSwitchCase
, and NgSwitchDefault
as seen in this demo.
Source
<select [(ngModel)]="type">
<option [value]="1">First</option>
<option [value]="2">Second</option>
<option [value]="3">Third</option>
<option [value]="99">Other</option>
</select>
<div [ngSwitch]="type">
<div *ngSwitchCase="1">First</div>
<div *ngSwitchCase="2">Second</div>
<div *ngSwitchCase="3">Third</div>
<div *ngSwitchDefault>Default</div>
</div>
Result
First