我收到以下错误“无法绑定到'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