Angular2递归组件输出

Question

我有以下问题:让我们假设我Component A有两个subcomponents Ar和Ad.Subcomponent Ar是递归创建的树,subcomponent Ad是在递归树(subcomponent Ar)中显示有关选择节点的详细信息的组件.如何将所选节点从子(子)组件Ar发送到Component Ad使用@Output？应该是@Output或其他什么？

app.component.html:

<tree [input]="fooTree" [output]="updateDetails($event)"></tree>
<tree-details [input]="input"></tree-details>

tree.component.html:

<tree [input]="fooTree.children"></tree>

树details.component.html

<div>{{input.name}}</div>
<div>{{input.id}}</div>

在这种情况下,我将只看到根树详细信息,如何从其他节点(递归创建之一)获取信息,何时选中？

Answer 1

更新:

在演示应用程序中更容易看到:https://plnkr.co/edit/WaYluZyPaC0OEV0YovbC？p = preview

..

你的tree-componentAr可以有一个@Ouput().您的AppComponent将使用此输出,并将所选数据发布到第二个子组件detail-component.

app.component.html

<tree (yourOutputNameHere)="yourFunctionToReceiveAndPostSelectedData($event)"></tree>
<details #yourDetailViewComponent></details>

tree.component.html

<tree (yourOutputNameHere)="yourFunctionToReceiveAndPostSelectedData($event)"></tree>

您tree-component甚至可以@Input()在模板中使用以下内容:

app.component.html

<tree [detail-view-input]="yourDetailViewComponent"></tree>
<details #yourDetailViewComponent></details>

tree.component.html

<tree [detail-view-input]="detailViewInput"></tree>