Angular2 chuyển tương tác thành phần với mẹ

Question

Hãy xem xét các sơ đồ dưới đây cho ứng dụng của tôi

EventsHub là một dịch vụ tiêm đơn giản:

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

Vấn đề là khi chức năng 'thông báo' được gọi là từ bên trong Quỹ, Khách hàng hoặc bất kỳ thành phần nào khác bên trong bộ định tuyến, phụ huynh (MainApp) sẽ không nhận được bất kỳ tin nhắn nào.

Mặt khác, khi tôi gọi cùng một chức năng dịch vụ từ NavigationMenu, MainApp nhận sự kiện này tốt. Vậy làm cách nào để các thành phần được định tuyến tương tác với cha mẹ?

Cảm ơn

trường hợp này đã được thử nghiệm trên RC1 & RC2

Answer 1

En chắc chắn bạn chỉ cung cấp EventsHub chỉ một lần trên một phụ huynh chung (thành phần gốc). DI duy trì một trường hợp duy nhất cho mọi nhà cung cấp. Nếu bạn cung cấp nó ở mọi thành phần sử dụng nó thì mọi thành phần đều có một cá thể khác. Vì vậy, một thành phần lắng nghe trên một thể hiện và phát ra một thành phần khác.

Answer 2

Ví dụ thành phần Funds của bạn có thể có một EventEmitter

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

Sau đó, Quỹ của bạn có thể phát ra sự kiện này gọi điện thoại của tôi:

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