Angular2exception：由于它不是已知的本地属性，因此无法绑定到“ngForIn”

我究竟做错了什么？

import {bootstrap, Component} from 'angular2/angular2' @Component({ selector: 'conf-talks', template: `<div *ngFor="let talk in talks"> {{talk.title}} by {{talk.speaker}} <p>{{talk.description}} </div>` }) class ConfTalks { talks = [ {title: 't1', speaker: 'Brian', description: 'talk 1'}, {title: 't2', speaker: 'Julie', description: 'talk 2'}]; } @Component({ selector: 'my-app', directives: [ConfTalks], template: '<conf-talks></conf-talks>' }) class App {} bootstrap(App, []) 

错误是

 EXCEPTION: Template parse errors: Can't bind to 'ngForIn' since it isn't a known native property ("<div [ERROR ->]*ngFor="let talk in talks"> 

Answer 1

由于这至less是我第三次浪费了5分钟以上的时间，所以我想我会发问与答。我希望它可以帮助其他人在路上…可能是我！

我inputin而不是在ngForexpression式。

Pre beta.17 ，应该是：

 <div *ngFor="#talk of talks"> 

从beta.17开始，使用let语法而不是# 。 进一步查看更新了解更多信息。

---

请注意，ngFor语法“desugars”到以下内容：

 <template ngFor #talk [ngForOf]="talks"> <div>...</div> </template> 

如果我们用它来代替，它会变成

 <template ngFor #talk [ngForIn]="talks"> <div>...</div> </template> 

由于ngForIn不是具有相同名称的input属性（如ngIf ）的属性指令，因此Angular会尝试查看它是否是template元素的（已知本机）属性，并且不是，因此是错误。

更新 – 从beta.17开始，使用let语法而不是# 。 这更新到以下内容：

 <div *ngFor="let talk of talks"> 

请注意，ngFor语法“desugars”到以下内容：

 <template ngFor let-talk [ngForOf]="talks"> <div>...</div> </template> 

如果我们用它来代替，它会变成

 <template ngFor let-talk [ngForIn]="talks"> <div>...</div> </template> 

Answer 2

就我而言，我错了

 <div *ngFor="let talk of talks"> 

同

 <div *ngFor="let talk in talks"> 

所以你必须用内部的*ngFor指令代替。

我正在做Angular 1.x的方式。 花了我4个小时实现它！ ☹️

Answer 3

在我的情况下，WebStrom自动完成插入的lowercased *ngfor ，即使它看起来像你select正确的骆驼一个（ *ngFor ）。

Answer 4

我的问题是，Visual Studio自动降低* ngFor * ngfor复制和粘贴。

Answer 5

尝试import { CommonModule } from '@angular/common';导入import { CommonModule } from '@angular/common'; 在angular度最后as * ngFor，* ng如果所有都出现在CommonModule中

Answer 6

我的解决scheme是 – 从expression式^ __ ^中删除'*'字符

 <div ngFor="let talk in talks">