Angular2 路由组件与父组件的交互

Question

请考虑我的应用程序的下图

EventsHub 是一个简单的可注入(inject)服务:

import {Injectable} from '@angular/core';
import {Subject}    from 'rxjs/Subject';

@Injectable()
export class EventsHub {
    private announcementSource = new Subject<string>();
    messageAnnounced$ = this.announcementSource.asObservable();

    announce( message : string)  {
        console.log('eventHub : firing...'+message);
        this.announcementSource.next(message);
   }
} 

问题是当从 Funds、Clients 或 router-outlet 内的任何其他组件调用“announce”函数时，父级(MainApp)将不会收到任何消息。

另一方面，当我从 NavigationMenu 调用相同的服务函数时，MainApp 会很好地接收事件。那么路由组件应该如何与其父组件交互？

谢谢

此案例已在 RC1 和 RC2 上进行测试

Answer 1

确保您在公共(public)父级(根组件)上仅提供一次 EventsHub。 DI 为每个提供者维护一个实例。如果你在每个使用它的组件上提供它，每个组件都会得到一个不同的实例。因此，一个组件监听一个实例，而另一个组件在另一个实例上发出。