Question

这是我的product.component.html

<div class="col-md-6">
    <table class="table table-bordered table-responsive">
        <thead>
            <tr>
                <th class="text-center">Име</th>
                <th class="text-center">Фамилия</th>
                <th class="text-center">Град</th>
            </tr>
        </thead>
        <tbody>
            <tr *ngFor="let i as months">
                <td>{{i}}</td>
            </tr>
        </tbody>
    </table>
</div>

这是我的product.component.ts

  import { Component } from '@angular/core';

@Component({
  selector: 'app-product',
  templateUrl: './product.component.html',
  styleUrls: ['./product.component.css']
})

导出类ProductComponent {

  months = ["January", "Feburary", "March", "April", "May", 
        "June", "July", "August", "September",
        "October", "November", "December"];

}

这是我的app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {RouterModule} from'@angular/router';
import { FormsModule } from '@angular/forms';


import { AppComponent } from './app.component';
import { ProductComponent } from './product/product.component';
import { ItemComponent } from './item/item.component';

@NgModule({
  declarations: [
    AppComponent,
    ProductComponent,
    ItemComponent
  ],
  imports: [
    BrowserModule,
      FormsModule,

  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

我没有使用ngFor在html中打印我的月份，因为错误“无法绑定到'ngForAs'，因为它不是'tr'的已知属性。（”“

Answer 1

首先，您在导入中缺少 CommonModule 。在 AppModule ：

中添加

import { CommonModule } from `@angular/common';

imports: [
  CommonModule, 
  BrowserModule,
  FormsModule,
],

其次， *ngFor 语法错误。纠正它以便跟随。

 <tr *ngFor="let i of months">

Angular 4：ngFor里面的html无法正常工作

1 个答案: