angular - Angular2 routed component interaction with parent

Question

Please consider the bellow diagram for my application

EventsHub is a simple injectable service :

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);
   }
} 

The problem is when 'announce' function is called from within Funds,Clients or any other component inside the router-outlet , the parent (MainApp) will not receive any messages.

On the other hand,when I call the same service function from NavigationMenu , MainApp receives the event just fine. So how is it supposed for routed components to interact with their parent ?

Thanks

this case has been tested on RC1 & RC2

Answer 1

确保您EventsHub只在一个公共父级（根组件）上提供一次。DI 为每个提供者维护一个实例。如果您在每个使用它的组件中提供它，那么每个组件都会获得一个不同的实例。因此，一个组件在一个实例上侦听，另一个在另一个实例上发出。

Answer 2

例如，您的Funds组件可能有一个 EventEmitter

@Output() someEvent: EventEmitter<SomeResult> = new EventEmitter<SomeResult>();

然后你的资金可以发出这个事件我的电话：

this.someEvent.emit({'Hello', 'from', 'the', 'other','side'});