Angular 4 纳克

Angular 4 ngFor

我不明白为什么 Angular 4 会出现这个错误,我什至从 angular/common 导入了 ngFor。我发现的问题都与 angular 1 => angular 2 有关。我相信公共库是由浏览器模块导入的。这与我之前构建的 angular 2 个应用程序的配置相同。 错误:

无法绑定到 'ngForIn',因为它不是 'div' 的已知 属性。 ("]*ngFor='let entry in resumeEntries'>

组件

import { Component, OnInit } from '@angular/core';
import {RetrieveService} from '../../services/retrieve.service';
@Component({
selector: 'app-resume',
templateUrl: './resume.component.html',
styleUrls: ['./resume.component.css']
})
export class ResumeComponent implements OnInit {
resumeEntries:any[];
constructor(private retrieveService:RetrieveService) { }

ngOnInit() {
  this.retrieveService.getResume().subscribe(response=>{
    this.resumeEntries=response.entries;
  });
}

}

HTML

<div *ngFor='let entry in resumeEntries'>
works
</div>

App.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {RouterModule,Routes} from '@angular/router';
import { HttpModule } from '@angular/http';

//components
...
//services
import {RetrieveService} from './services/retrieve.service';
const AppRoutes: Routes =[
  {path:'resume',component:ResumeComponent},
  {path:'admin', component:AdminComponent},
  {path:'',component:LandingPageComponent}
]
@NgModule({
  declarations: [
    AppComponent,
    LandingPageComponent,
    DashBarComponent,
    ResumeComponent,
    SocialMediaComponent,
    AdminComponent,
    AdminContactInfoComponent 
  ],
  imports: [
    BrowserModule,
    RouterModule.forRoot(AppRoutes),
    HttpModule
  ],
  providers: [RetrieveService],
  bootstrap: [AppComponent]
})

Angular 有 NgForOf,没有 NgForIn。它应该是 let varName of array,但你有 in,所以将你的模板代码更新为这个。

<div *ngFor='let entry of resumeEntries'>
works
</div>

查看 API 文档 NgForOf HERE 了解有关 "decomposed" 和 "asterisk" 语法的更多详细信息