我收到以下错误“无法绑定到'ngswitchwhen',因为它不是'template'的已知属性”。我阅读了建议添加
从“@angular/common”导入{commonmodule}
并在@ngmodel的imports部分添加“commonmodule”,我做到了,但这并没有解决问题。我想不出我做错了什么,有什么办法能帮我解决这个问题吗?
这是我的“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 {

}

最佳答案

它应该是ngSwitchCase而不是ngSwitchWhen
https://angular.io/docs/ts/latest/api/common/index/NgSwitchCase-directive.html

09-11 19:43
查看更多