我是angular2的新手,我对使用EmitterService的EventEmitter感到困惑,任何人都可以向我解释Emitter的目的。
如果不使用@input和@output,我们可以将数据发送到一个页面组件到另一个页面组件。
谢谢
答案 0 :(得分:5)
阅读this Angular cookbook about component interaction and flow,,特别是this部分关于侦听子事件的父组件。
基本上,EventEmitter完全是为了父组件从子组件获取数据的目的。所有@Output都是EventEmitters,而@Output装饰器公开父类可以在其模板中附加侦听器的事件。
在子组件中,您可以像这样定义一个EventEmitter:
@Output() childEventEmitter = new EventEmitter<any>();
你发出这样的事件:
this.childEventEmitter.emit("Send this to the parent");
完成后,父母可以监听事件并附上一个回调,其中只有以下内容:
<child-component (childEventEmitter)="parentCallback(whateverWasEmitted)"></child-component>
它使(child - &gt; parent)通信像普通的分层数据流(parent - &gt; child)一样容易。您可能已经或可能没有注意到,当您从父级向子级发送信息时,父级使用[方括号]绑定到模板中子级的@Input属性。当父级从子级接收信息时,在其模板中,它将使用(括号)绑定到子级的@Output事件。这是Angular 2中的重要原则。
@Input()属性是[方括号] 为 @Output()是事件是(括号)。
要回答您的其他问题,是的,组件层次结构中不是直接“下一个”的组件可以进行通信,但在这种情况下,需要Angular 2服务的公共实例。充当各种各样的中间人。阅读我之前链接的Angular 2食谱的this section以了解更多相关信息。