2017-09-04 140 views
0

我不明白为什么我得到这个错误与Angular 4,我甚至从angular/common导入ngFor。我发现的问题都与angular 1 => angular 2有关。而且我相信浏览器模块导入了通用库。这与我以前构建的角度2应用程序的配置相同。 错误:Angular 4 ngFor

无法绑定到'ngForIn',因为它不是'div'的已知属性。 (“] * ngFor = '让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] 
}) 

回答

3

角有NgForOf,而不是NgForIn。它应该是let varName of array,但是您有in,因此请将您的模板代码更新为此。

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

检查NgForOfHERE API文档,详细了解了“分解”和“星号”语法

+0

哦,我看到他们改变了它作为V4.0.0的,这工作,谢谢。 –