角度异常:无法绑定到‘ngForIn‘,因为它不是已知的本机属性

本文翻译自:Angular exception: Can't bind to 'ngForIn' since it isn't a known native property

What am I doing wrong? 我究竟做错了什么?

import {bootstrap, Component} from 'angular2/angular2'

@Component({
  selector: 'conf-talks',
  template: `
{{talk.title}} by {{talk.speaker}}

{{talk.description}}

` }) class ConfTalks { talks = [ {title: 't1', speaker: 'Brian', description: 'talk 1'}, {title: 't2', speaker: 'Julie', description: 'talk 2'}]; } @Component({ selector: 'my-app', directives: [ConfTalks], template: '' }) class App {} bootstrap(App, [])

The error is 错误是

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

#1楼

参考:https://stackoom.com/question/2L0wC/角度异常-无法绑定到-ngForIn-因为它不是已知的本机属性


#2楼

Since this is at least the third time I've wasted more than 5 min on this problem I figured I'd post the Q & A. I hope it helps someone else down the road... probably me! 由于这至少是我第三次在这个问题上浪费超过5分钟,我想我会发布Q&A。我希望它可以帮助其他人在路上...可能是我!

I typed in instead of of in the ngFor expression. 我输入in ,而不是of在ngFor表达。

Befor 2-beta.17 , it should be: Befor 2-beta.17 ,它应该是:

As of beta.17, use the let syntax instead of # . 从beta.17开始,使用let语法而不是# See the UPDATE further down for more info. 有关详细信息,请参阅更新信息。


Note that the ngFor syntax "desugars" into the following: 请注意,ngFor语法“desugars”到以下内容:


If we use in instead, it turns into 如果我们使用in ,相反,它变成


Since ngForIn isn't an attribute directive with an input property of the same name (like ngIf ), Angular then tries to see if it is a (known native) property of the template element, and it isn't, hence the error. 由于ngForIn不是具有相同名称的输入属性的属性指令(如ngIf ),因此Angular会尝试查看它是否是template元素的(已知的本机)属性,而不是,因此是错误。

UPDATE - as of 2-beta.17, use the let syntax instead of # . 更新 - 从2-beta.17开始,使用let语法而不是# This updates to the following: 这会更新到以下内容:

Note that the ngFor syntax "desugars" into the following: 请注意,ngFor语法“desugars”到以下内容:


If we use in instead, it turns into 如果我们使用in ,相反,它变成



#3楼

我的问题是,是的Visual Studio莫名其妙自动使用小写字母 *ngFor*ngfor上复制和粘贴。


#4楼

在我的情况下,WebStrom自动完成插入小写*ngfor ,即使它看起来你选择了正确的驼峰( *ngFor )。


#5楼

我的解决方案是 - 只需从表达式^ __ ^中删除'*'字符


#6楼

Try to import import { CommonModule } from '@angular/common'; 尝试import { CommonModule } from '@angular/common';导入import { CommonModule } from '@angular/common'; in angular final as *ngFor , *ngIf all are present in CommonModule 在角度最终为*ngFor*ngIf都出现在CommonModule

你可能感兴趣的:(角度异常:无法绑定到‘ngForIn‘,因为它不是已知的本机属性)