0

截至今天，我正在使用最新版本的 Angular2，并遵循 Angular 2 网站上的官方示例。https://angular.io/docs/ts/latest/tutorial/toh-pt2.html
我正在尝试使用解析数组*ngFor并获得以下异常Template parse errors: Can't bind to 'ngFor' since it isn't a known native property。
Iv'e 查看了其他问题是语法的帖子，但据我所知，语法没有任何错误。

有人可以告诉我哪里出错了。谢谢！！！

app.component.ts

import {Component} from 'angular2/core';

export class Hero {
  id:number;
  name:string;
}


@Component({
  selector: 'my-app',
  template: `
        <h1>{{title}}</h1>
        <h2>My Heroes</h2>
        <ul class="heroes">
          <li *ngFor="let hero of heroes">

          </li>
        </ul>
        <h2>{{hero.name}} details</h2>
        <div><label>id: </label>
        {{hero.id}}</div>
        <div><label>name: </label>
        <input [(ngModel)] = "hero.name" 
        placeholder="Hero Name">
        </div>
    `,
})


export class AppComponent {
  title = 'Quest of Heroes'
  hero:Hero = {id: 1, name: 'Windstorm'};

  public heroes = HEROES;
}

const HEROES:Hero[] = [
  {id: 11, name: 'Mr. Nice'},
  {id: 12, name: 'Narco'},
  {id: 13, name: 'bombboy'},
  {id: 14, name: 'Dr. Deseract'},
  {id: 15, name: 'Miss. Mistique'},
  {id: 16, name: 'codeopolos'},
  {id: 17, name: 'jupitarious'}
];

引导.ts

///<reference path="../node_modules/angular2/typings/browser.d.ts"/>
import {bootstrap} from 'angular2/platform/browser';
import {AppComponent} from "./app.component";
bootstrap(AppComponent);
4

3 回答 3

2

发生此错误是因为您使用的是已弃用的 angular 2 版本。我可以通过您导入角度模块的方式来告诉它。

在较新的版本上不再需要导入 ngFor 或 ngIf。

最重要的是，没有理由在候选发布之前使用任何版本来构建任何东西。

于 2016-07-07T21:09:55.970 回答
0

感谢您的洞察力，我在 Angular 上运行旧版本。现在工作正常。

于 2016-07-26T12:42:08.770 回答
0

你必须import从ngFor图书馆

import {FORM_DIRECTIVES, NgFor, NgIf} from '@angular/common';

于 2016-07-07T21:00:09.223 回答