상위 구성 요소에서 출력 바인딩의 속성 사용

Question

여기에는 간단한 내용이 누락되어 있어야하지만, 출력 이벤트를 통해 개체를 내 보낸 자식 구성 요소가 있습니다. 부모 구성 요소는 다음과 같은 템플릿이 출력에 구독이 같은 구성 요소의 수출 클래스 내에서

<div class="tree-panel-container"> 
    <div class="tree-panel-content"> 
     <content-tree (contextSelected)="contextPanelSelected($event);"></content-tree> 
    </div> 
    <context-panel> 
     <div class="context-panel"> 
      <h2>{{contextTitle}}</h2> 
     </div> 
    </context-panel> 
</div> 

이 같은 함수입니다 :

contextPanelSelected($event) { 
    console.log($event); 
} 

이 함수의 console.log이 올바른지, 그래서 출력 객체가 예상대로 통과한다는 것을 알았습니다. 내가 뭘하고 싶은데이 출력 개체에 대한 속성을 사용하여 템플릿에 {{contextTitle}} 값을 채 웁니다.

누구든지이 방법을 제안 할 수 있습니까?

감사합니다. 다음 코드에서

contextPanelSelected(value) { 
    console.log(value); 
    this.contextTitle = value; 
} 

:

(contextSelected)="contextPanelSelected($event)" 

$event 이벤트 contextSelected.emit('some text')를 통해 전송되는 데이터에 해당

Answer 1

는 다음 사용합니다. 이 값은 contextPanelSelected 메서드의 매개 변수로 전달할 수 있습니다. 이 메서드는이 매개 변수를 구성 요소의 contextTitle 속성으로 설정합니다.