角度2-如何在同级组件中调用函数? [英] Angular 2 - How do you call a function in a sibling component?

问题描述

我有2个需要交流的同级组件:

I have 2 sibling components that need to communicate:

<app-controls></app-controls> <app-main></app-main>

<app-controls></app-controls> <app-main></app-main>

app-controls包含需要触发app-main组件中的事件的按钮.是否有符合Angular 2样式指南的方式?

app-controls contains buttons that need to trigger events in the app-main component. Is there a Angular 2 style guide compliant way of doing so?

推荐答案

您可以使用模板变量来获取对同级的引用. 如果<app-controls>具有一个输出，当单击按钮时它会发出事件，您可以执行以下操作:

You can use a template variable to get a reference to the sibling. If <app-controls> has an output where it emits events when a button is clicked you can do:

<app-controls (buttonClicked)="main.doSomething($event)"></app-controls>
<app-main #main></app-main>

，或者您可以传递对@Input() siblings;的引用，然后在其上调用方法:

or you can pass a reference to a @Input() siblings; and then call methods on it:

<app-controls [sibling]="main"></app-controls>
<app-main #main></app-main>

这篇关于角度2-如何在同级组件中调用函数?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！