자식 구성 요소에서 부모 구성 요소 값을 param으로 전달

Question

데코레이터를 통해 부모 구성 요소에서 name 문자열을 하위 구성 요소로 보냅니다. 이 문자열 name은 하위 구성 요소의 함수로 매개 변수로 입력됩니다.

부모 구성 요소의 이벤트 (예 : 클릭)가 실행될 때마다 name이 매개 변수로 사용되므로이 name 값이 변경되고 하위 구성 요소의 기능에 영향을줍니다.

@Input() name: string; 

ngOnChanges() { 
    this.childFunction(this.name); 
} 

지금 직면하고있어 문제는 아이 뷰는 이전 함수 호출에서 값을 유지한다는 것입니다 : 이것은 내 하위 구성 요소에서 미리보기입니다. 부모가 클릭 할 때마다 새 출력을 추가하기 만하면 이전 출력을 제거하고 새 출력을 새 출력으로 바꿀 수 있습니다.

업데이트 : 해결책을 찾았지만 올바른 것인지 확실하지 않습니다. 기본적으로 하위 함수는 객체 배열을 반환하므로 모든 함수 호출이 시작될 때 배열을 단순히 비우는 것입니다. 이 문제가 해결 된 것 같습니다.

Answer 1

ngOnInit은 구성 요소에 대해 한 번만 실행됩니다. 대신 ngOnChanges를 사용하십시오. 여기에 문서를 참조하십시오 : 그것은 구성 요소 (또는 지침)의 입력 속성에 변화를 감지 할 때마다 https://angular.io/docs/ts/latest/guide/lifecycle-hooks.html#!#onchanges

각도가 ngOnChanges() 메서드를 호출합니다. 이 예제 은 OnChanges 후크를 모니터링합니다.

ngOnChanges(changes: SimpleChanges) { 
    for (let propName in changes) { 
    let chng = changes[propName]; 
    let cur = JSON.stringify(chng.currentValue); 
    let prev = JSON.stringify(chng.previousValue); 
    this.changeLog.push(`${propName}: currentValue = ${cur}, previousValue = ${prev}`); 
    } 
}