Angular 2:简单* ng不工作

时间:2017-06-13 08:06:05

标签: angular angular2-databinding angular-ng

我在app/component.ts

中有这个
import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  template: `
    <ul>
      <li *ngFor="let course of courses">
        {{ course }}
      </li>
    </ul>
  `,
  styleUrls: ['./app.component.css']
})

export class AppComponent {
  course = ['Course 1', 'Course 2', 'Course 3'];
}

在我的app.module.ts中,我还导入了必要的东西

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'

import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    CommonModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

这只是一个简单的* ngFor代码,但为什么它不起作用。除此之外,我还没有碰到任何东西

1 个答案:

答案 0 :(得分:3)

你有一个拼写错误,检查你的组件定义。您定义了course = [...];,但在模板中使用了courses。尝试将组件中的变量名称更改为课程