각도 - 한 구성 요소를 다른 구성 요소로 전달

Question

더미 Angular 응용 프로그램에는 두 개의 구성 요소 인 counter과 test01이 있습니다. 여기서 볼 수 있듯이 repository file

이 GitHub 저장소는 완전히 작동하는 예제를 포함합니다.

이 이미지를 확인하십시오. 버튼을 클릭하면

는 성공적으로 8 : "변경 카운터 값"그것은에 카운터 수를 설정합니다.

하지만 제 질문은 test01 메서드 내부에서 값을 변경하기 위해 구성 요소를 test01 구성 요소로 전달하는 방법이 있습니까? 더없이 너무 많은 코드

test01_obj.counter = 8; 

:

는 현재 구성 요소의 논리는 : 당신은 내가 그런 짓을하고 싶은 here

를 볼 수 test01는 더 어렵다.

이것에 대한 아이디어가 있으십니까?

Answer 1

잘못된 방식으로 문제에 접근하고 있습니다.

대신 두 구성 요소 사이의 모델 (개수)을 공유하고 [간접] 상호 작용을 달성하기 위해 바인딩을 사용하는 것이 좋습니다.

은 즉 :

export class ContainerComponent { 

    myCounterModel: CounterModel = { 
     count: 0 
    }; 
    ... 
} 

export class CounterComponent { 
    ... 
    @Input() 
    counter: CounterModel; 
} 

export class Test01Component { 
    ... 
    @Input() 
    counter: CounterModel; 
} 


    //ContainerComponent template 

<counter [(counter)]="myCounterModel"></counter> 
<hr /> 
<test01 [(counter)]="myCounterModel" [resetValue]="8"></test01> 

의미가 있습니다?