예외 : 알려진 기본 속성이 아니기 때문에 'ngFor'에 바인딩 할 수 없습니다.

내가 뭘 잘못하고 있죠?

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

@Component({
  selector: 'conf-talks',
  template: `<div *ngFor="talk of 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 'ngFor' since it isn't a known native property
("<div [ERROR ->]*ngFor="talk of talks">

나는 let앞에 놓쳤다 talk:

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

참고 beta.17의의로 의 사용 #...내부 NgFor 같은 구조 지침의 지역 변수를 선언하는이되지 않습니다. let대신 사용하십시오 .

<div *ngFor="#talk of talks"> 이제는 <div *ngFor="let talk of talks">

원래 답변 :

나는 #앞에 놓쳤다 talk:

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

잊어 버리기 쉽습니다 #. Angular 예외 오류 메시지에 다음과 같이 표시되기를 바랍니다
you forgot that # again.

OP 오류로 이어지는 다른 오타는 다음을 사용할 수 있습니다 in.

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

of대신 사용해야 합니다 :

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

이 진술은 Angular2 베타 버전에서 사용되었습니다 .....

이후 # 대신 let 을 사용 하십시오 .

하자 키워드하는 지역 변수를 선언하는 데 사용됩니다

제 경우에는 소문자였습니다 f. 이것이 Google의 첫 번째 결과이기 때문에이 답변을 공유하고 있습니다.

반드시 쓰십시오 *ngFor

각도 7에서는 다음 줄을 .module.ts파일 에 추가 하여이 문제를 해결했습니다 .

import { CommonModule } from '@angular/common'; imports: [CommonModule]

지역 변수를 선언하려면 let 키워드를 사용해야합니다. 예 : * ngFor = "토론 대화"

긴 이야기를 짧게 줄이기 위해 실수로 angular-beta-16으로 다운 그레이드했습니다.

let ... 구문은 2.0.0-beta.17 +에서만 유효합니다.

이 버전 아래에있는 let 구문을 사용하면 이 오류가 발생합니다.

angular-beta-17로 업그레이드하거나 항목 구문에서 #item을 사용하십시오.

내 경우 *ng-for=에는 문서에서 복사하는 실수를 저질렀습니다 .

https://angular.io/guide/user-input

내가 틀렸다면 나를 바로 잡으십시오. 그러나 보인다 *ng-for=변경되었습니다*ngFor=

" @Input "(Doh!)으로 컴포넌트에 주석을 달 것을 잊었습니다 .

book-list.component.html ( 불법 코드) :

<app-book-item
  *ngFor="let book of book$ | async"
  [book]="book">  <-- Can't bind to 'book' since it isn't a known property of 'app-book-item'
</app-book-item>

book-item.component.ts 의 수정 된 버전 :

import { Component, OnInit, Input } from '@angular/core';

import { Book } from '../model/book';
import { BookService } from '../services/book.service';

@Component({
  selector: 'app-book-item',
  templateUrl: './book-item.component.html',
  styleUrls: ['./book-item.component.css']
})
export class BookItemComponent implements OnInit {

  @Input()
  public book: Book;

  constructor(private bookService: BookService)  { }

  ngOnInit() {}

}

또한 순수한 TypeScript를 사용하지 마십시오 ... for사용법과 사용 에 더 부합 *ngFor="const filter of filters"하고 ngFor 알려진 속성 오류가 발생했습니다. let으로 const를 바꾸면됩니다.

@ alexander-abakumov 님이 of로 교체를 요청했습니다 in.

필자의 경우 * ngFor를 사용하여 구성 요소를 포함하는 모듈이 app.module.ts에 포함되지 않았습니다. imports 배열에 포함 시키면 문제가 해결되었습니다.

그냥 내가 같은 오류가되었고, 이유는 사용 된 또 하나의 케이스 커버하기 에 대신 의 반복자에를

잘못된 방법 let file in files

올바른 방법 let file of files

이것을 사용하십시오

<div *ngFor="let talk of talks> 
   {{talk.title}} 
   {{talk.speaker}}
   <p>{{talk.description}} 
</div>

객체 배열을 반복하려면 변수를 지정해야합니다.