Angular2 — невозможно привязать к «ngSwitchWhen», так как это неизвестное свойство «шаблона».

Я получаю следующую ошибку: «Не удается выполнить привязку к ngSwitchWhen, поскольку это неизвестное свойство шаблона». Я читал разные темы, где советовали добавить

импортировать {CommonModule} из '@angular/common'

и добавьте «CommonModule» в раздел импорта @NgModel, что я и сделал, однако это не решило проблему. Я не могу понять, что я делаю неправильно, любая помощь в том, как исправить это?

Это мой код для "app.component.ts"

import { Component } from '@angular/core'

@Component({
  selector: 'app-root',
  template: `
     <ul class="nav nav-pills">
        <li [class.active]="viewMode == 'map'"><a (click)="viewMode = 'map'">Map View</a></li>
        <li [class.active]="viewMode == 'list'"><a (click)="viewMode = 'list'">List View</a></li>
     </ul>
     <div [ngSwitch]="viewMode">
     <template [ngSwitchWhen]="'map'" ngSwitchDefault>Map View Content></template>
     <template [ngSwitchWhen]="'list'">List View Content</template>
     </div>
    `
})

export class AppComponent {
  viewMode = 'map';
} 

А это код для "app.module.ts"

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, ApplicationRef } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { CommonModule } from '@angular/common';

import { AppComponent } from './app.component';
import { FavoriteComponent } from './favorite.component';
import { HeartComponent } from './heart.component';
import { VoteComponent } from './vote.component';
import { TweetComponent } from './tweet.component';

@NgModule({
  declarations: [
    AppComponent,
    FavoriteComponent,
    HeartComponent,
    VoteComponent,
    TweetComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    CommonModule
  ],
  providers: [],
  entryComponents: [AppComponent],
  bootstrap: [AppComponent]
})

export class AppModule {

}