我确信我必须在这里遗漏一些简单的东西,但我有一个子组件,它通过Output事件发出一个对象。然后,父组件在模板中订阅此输出,如下所示:
<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}}
的值。
有人可以建议怎么做吗?
非常感谢。
答案 0 :(得分:0)
您使用以下内容:
contextPanelSelected(value) {
console.log(value);
this.contextTitle = value;
}
在以下代码中:
(contextSelected)="contextPanelSelected($event)"
$event
对应于通过事件contextSelected.emit('some text')
发送的数据。此值可以作为contextPanelSelected
方法的参数传递。然后,此方法负责将此参数设置为组件的contextTitle
属性。