Como funciona o ngSwitch em Angular2?

à moda antiga

Alterado para ngSwitch
alterado ng-switch-quando para ngSwitchWhen

<div layout="column" layout-align="center center">

       <div [ngSwitch]="value">
      <div *ngSwitchWhen="'init'">
         <button md-raised-button class="md-raised md-primary">User</button>
         <button md-raised-button class="md-raised md-primary">Non user</button>

      </div>
      <div *ngSwitchWhen="0">Second template</div>
      <div *ngSwitchWhen="1">Third Template</div>
    </div>
 </div>
   <button md-fab
 class="md-fab wizard_button--next"
  aria-label="about"
  (click)="onNext()">
<i class="material-icons" md-icon="">play_arrow</i>
 </button>

ANGULAR.2.0.0 ou Relase Final

Por favor, note que as coisas mudaram na versão final, por isso, se estiver a usar a versão final, por favor, veja abaixo um exemplo simples.

Demonstração simples: http://plnkr.co/edit/IXmUm2Th5QGIRmTFBtQG?p=preview

@Component({
  selector: 'my-app',
  template: `
  <button (click)="value=1">select - 1</button>
  <button (click)="value=2">select - 2</button>
  <button (click)="value=3">select - 3</button>
  <h5>You selected : {{value}}</h5>

  <hr>
  <div [ngSwitch]="value">

     <div *ngSwitchCase="1">1. Template - <b>{{value}}</b> </div>
     <div *ngSwitchCase="2">2. Template - <b>{{value}}</b> </div>
     <div *ngSwitchCase="3">3. Template - <b>{{value}}</b> </div>
     <div *ngSwitchDefault>Default Template</div>

  </div>
  `,

})
export class AppComponent {}

1. NgSwitch - define o property value de model. Por exemplo - viewMode, que é uma propriedade no seu componente.

2. NgSwitchCase - define o que renderizar quando o value do property definido em ngSwitchChanges. Para ex. quando viewMode = 'map'

3. NgSwitchDefault - define o que renderizar se o value não corresponder. Para ex. quando viewMode=undefined O padrão será rendered.

Outro ponto importanteé que precisamos de definir o [ngSwitchCase] dentro de um <template></template> elemento HTML caso contrário, não funcionará. Angular irá automaticamente convertê-lo numa etiqueta <div>.

<div [ngSwitch]="'viewMode'">
  <template [ngSwitchCase]="'map'" ngSwitchDefault> 
     Map View Content...   
   </template>      
   <template [ngSwitchCase]="'list'"> 
      List View Content...
  </template>
</div>