Question

我搜索了这个here和here。我使用版本2.0.0-beta.7 for angular 2但它给我这样的错误：

EXCEPTION: Template parse errors:
Can't bind to 'ngForFrom' since it isn't a known native property ("<h2>list of fruits</h2>

<ul>
<li [ERROR ->]*ngFor="#item from itemList">{{item.name}}</li>
</ul>"): ItemComponent@2:4
Property binding ngForFrom not used by any directive on an embedded template ("<h2>list of fruits</h2>
<ul>

据了解，它使用的是骆驼外壳，但它对我不起作用。

这是我的.ts文件：

import {Component} from "angular2/core";

@Component({
selector:'my-list'
template:`<h2>list of fruits</h2>
<ul>
<li *ngFor="#item from itemList">{{item.name}}</li>
</ul>`
})

export class ItemComponent{
public itemList=[
{name:"Apple"},
{name:"Orange"},
{name:"Grapes"}
];

}

Answer 1

请使用最新发布的Angular 2版本并修改您的代码，如下所示。

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

@Component({
    selector: 'my-list',
    template:   `<h2>list of fruits</h2>
                <ul>
                    <li *ngFor="let item of itemList">{{item.name}}</li>
                </ul>`
})

export class ItemComponent {
    public itemList = [
        { name: "Apple" },
        { name: "Orange" },
        { name: "Grapes" }
    ];

}

与您的代码相比的主要变化：

import {Component} from "angular2/core";

到

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

和

<li *ngFor="#item from itemList">{{item.name}}</li>

到

<li *ngFor="let item of itemList">{{item.name}}</li>

例外：模板解析错误：无法绑定到＆＃39; ngForFrom＆＃39;因为它不是一个已知的本地财产

1 个答案: