In the previous generations of Angular, if you wanted to have an alternative view for an if statement, one common approach was to use a switch statement. For example:

<div [ngSwitch]="isToggled">
  <span *ngSwitchCase="true">On</span>
  <span *ngSwitchDefault>Off</span>
</div>

This approach works reasonably well but if you implemented the same sort of logic in a template or controller you would likely choose to use an else statement instead. Now in Angular 4, we can set an else condition in our ngIf directive:

<div *ngIf="isAdmin; else normal_user">
  <p>You are an Admin</p>
</div>

<ng-template #normal_user>
  <p>You are a normal user</p>
</ng-template>

We simply provide an else statement with a view reference that will be shown if the logic in our ngIf directive evaluates to false. We can even supplement this new else case with the then non-inline template condition:

<div *ngIf="isAdmin; then admin_user else normal_user">
  <p>This will be hidden</p>
</div>

<ng-template #admin_user>
  <p>You are an Admin</p>
</ng-template>

<ng-template #normal_user>
  <p>You are a normal user</p>
</ng-template>

With this new feature, you can see how we can uniformly format different states of the template driven from the same if statement.