Co ja robię źle?
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, [])
Błąd jest
EXCEPTION: Template parse errors:
Can't bind to 'ngFor' since it isn't a known native property
("<div [ERROR ->]*ngFor="talk of talks">
angular
typescript
angular2-directives
ngfor
Mark Rajcok
źródło
źródło
#
) służy do deklarowania lokalnej zmiennej szablonuInną literówką prowadzącą do błędu OP może być użycie
in
:Zamiast tego powinieneś użyć
of
:źródło
To oświadczenie używane w wersji Angular2 Beta .....
Odtąd używaj let zamiast #
słowo kluczowe let służy do deklarowania zmiennej lokalnej
źródło
W moim przypadku był to mały list
f
. Dzielę się tą odpowiedzią tylko dlatego, że jest to pierwszy wynik w Googlepamiętaj, aby napisać
*ngFor
źródło
W Angular 7 naprawiłem to, dodając następujące wiersze do
.module.ts
pliku:import { CommonModule } from '@angular/common'; imports: [CommonModule]
źródło
Powinieneś użyć słowa kluczowego let do deklarowania zmiennych lokalnych, np. * NgFor = "let talks talks"
źródło
Krótko mówiąc, dla mnie niechcący obniżyłem wersję beta-16.
Składnia let ... obowiązuje TYLKO w wersji 2.0.0-beta.17 +
Jeśli wypróbujesz składnię let na cokolwiek poniżej tej wersji. Wygenerujesz ten błąd.
Uaktualnij do wersji kątowej-beta-17 lub użyj # elementu w składni przedmiotów.
źródło
W moim przypadku popełniłem błąd kopiowania
*ng-for=
z dokumentów.https://angular.io/guide/user-input
Popraw mnie, jeśli się mylę. Ale wygląda na to, że
*ng-for=
został zmieniony na*ngFor=
źródło
Zapomniałem dodać adnotacji do mojego komponentu za pomocą „ @Input ” (Doh!)
book-list.component.html (Kod obrażający):
Poprawiona wersja book-item.component.ts :
źródło
Również nie próbuj używać czystego TypeScript w tym ... Chciałem bardziej odpowiadać
for
użyciu i użyciu*ngFor="const filter of filters"
i dostałem ngFor nie znany błąd właściwości. Działa tylko zastąpienie const przez let.Jak powiedział @ Alexander-abakumov dla
of
zastąpionych przezin
.źródło
W moim przypadku moduł zawierający komponent używający * ngFor powodujący ten błąd nie został uwzględniony w app.module.ts. Umieszczenie go w tablicy importu rozwiązało problem.
źródło
Wystarczy pokryć jeszcze jeden przypadek, kiedy otrzymuję ten sam błąd i powód używał w zamiast od w iterator
Zła droga
let file in files
Właściwa droga
let file of files
źródło
Użyj tego
Musisz podać zmienną, aby iterować po tablicy obiektu
źródło