상위 경로에있는 버튼을 클릭하면 하위 구성 요소에서 작업을 수행하는 방법

Question

각도 4로 작업 중입니다. 응용 프로그램에 부모 및 자식 경로가 있습니다.

부모님, 나는 두 개의 버튼 -> '추가'& '제거'가 있습니다.

상위 경로에서 '추가'버튼을 클릭하면 자녀 컴포넌트의 기능을 호출하려고합니다. 나는 이것을 구현하는 방법을 모른다.

도움을 주시면 감사하겠습니다.

Answer 1

간단히 템플릿 변수를 사용할 수 있습니다.

// child.component.ts 
@Component({ selector: 'child', template: '...' }) 
export class ChildComponent { 
    public someFunctionToCall() {...} 
} 

// parent.component.html 
<div> 
    <child #childComponentRef></child> 

    <button (click)="childComponentRef.someFunctionToCall()">Add</button> 
</div>