Angular4 Freigeben von Daten an untergeordnete Komponente

Question

Ich habe eine übergeordnete Komponente, die eine API aufruft und die Daten zurückerhält. Es hat eine Schleife wie folgt aus:

<div *ngIf="campaign"> 
    <div *ngFor="let question of campaign.questions" bzQuestion></div> 
</div> 

können Sie sehen, dass ich eine andere Komponente bzQuestion, die wiederholt sich genannt haben. Ich möchte die Daten (Frage) an diese Komponente übergeben. Ich sah ein Video sagen Sie @Input verwenden können(), also tat ich dies:

import { Component, OnInit, Input } from '@angular/core'; 
import { IQuestion } from '../data/models/question.model'; 

@Component({ 
    selector: 'bz-question', 
    templateUrl: './question.component.html', 
    styleUrls: ['./question.component.scss'], 
    providers: [ ] 
}) 
export class QuestionComponent { 
    @Input() public question: IQuestion; 
} 

Ich habe versucht, sich die Frage an die untergeordnete Komponente, um dann hinzuzufügen, indem Sie auf die Eltern:

<div *ngIf="campaign"> 
    <div *ngFor="let question of campaign.questions" [question]="question" bzQuestion></div> 
</div> 

aber der Compiler stöhnt sagen:

Kann nicht binden zu ‚Frage‘, da es nicht eine bekannte Eigenschaft von ‚div‘ ist. (“

Weiß jemand, was ich falsch mache?

Answer 1

Sie müssen es in der Komponente tun, nicht div. Component Selector ist app-bzQuestion, oder so ähnlich, kann u, dass in finden. ts-Datei Ihrer Komponente.

<div *ngIf="campaign"> 
    <app-bzQuestion *ngFor="let question of campaign.questions" [question]="question"></app-bzQuestion> 
</div>