상위 구성 요소에 하위 구성 요소를 각도로 작성하십시오.

Question

저는 Angular & Typescript를 매우 신축했습니다. OOP에 익숙하다 & 자바 스크립트.

내가 만들고 parent 구성 요소의 변수에 따라 parent 구성 요소 내부 child 구성 요소 인스턴스의 수를 삽입 할 : 그리고 메신저 비트는 다음을 수행하는 방법에 혼동. 각 child 값을 parent에서 전달하는 값을 제공하고 싶습니다. 아래 코드는 나를 제공합니다 : Uncaught Error: Can't resolve all parameters for ParentComponent: (?, ?). 정확히 올바른 양의 매개 변수 &을 전달한 이래로 나에게 지옥처럼 혼란스러운 것은 무엇입니까?

Parnet 구성 요소 :

import { Component, OnInit } from '@angular/core'; 
import { ChildComponent } from './child/child.component'; 

@Component({ 
    selector: 'parent', 
    template: ` 
     <ul> 
     <li *ngFor='let child of collOfChildren'> 
      <child></child> 
     </li> 
    </ul> 
    ` 
}) 
export class ParentComponent implements OnInit { 
    private collOfChildren: Array<ChildComponent> = []; 

    numOfChildren = 3; 
    childNames = ['Child 1', 'Child 2','Child 3']; 

    constructor() { 
    } 

    ngOnInit() { 
    for(let i = 0; i < this.numOfChildren; i++) { 
     this.collOfChildren.push(new ChildComponent(this.childNames[i],5)); 
    } 
    } 

} 

하위 구성 요소 :

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

@Component({ 
    selector: 'child', 
    templateUrl: './child.component.html', 
    styleUrls: ['./child.component.css'] 
}) 
export class ChildComponent implements OnInit { 
    private name:String; 
    private age:number; 

    constructor(name:String, age:number) { 
    this.name = name; 
    this.age = age; 
    } 

    ngOnInit() { 
    } 

} 

Answer 1

, 당신은 단지에 자식 데이터를 전달해야 할 각도 튜토리얼, 당신은 자식 요소의 배열을 초기화하기 위해서 올바른 연습 필요가 없습니다했다 아래 하위 구성 요소 :

<child *ngFor="let childName of childNames" [name]="childName"> 

그리고 아래로 childComponnet의 이름을 입력 장식을 추가해야합니다

@Input() name: string;