Understanding ngSwitch in Angular

app.component.ts

import {Component} from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  number = 10;
}

app.component.html

<div [ngSwitch]="number">
  <p *ngSwitchCase="1">1</p>
  <p *ngSwitchCase="2">2</p>
  <p *ngSwitchCase="10">10</p>
  <p *ngSwitchDefault>Default</p>
</div>

References
https://github.com/mhdr/AngularSamples/tree/master/018/my-app