Вниз и вверх события

Question

Я пытаюсь угловой 2, и я думаю, что это здорово! Но я не могу понять, как испускать/подписываться на события.

Например: У меня есть два небольших компонента: componentA и componentB. КомпонентА содержит список фруктов. Компонент В содержит детали фруктов. Когда пользователь выбирает фрукты из списка (componentA), я хочу, чтобы ComponentB выполнял функцию (например, console.log (event)).

Для этого я хотел бы использовать события. ComponentA не является родителем компонента B, они братья. Но я хочу, чтобы событие распространялось вниз, а также вверх. Любой, кто знает название мероприятия, должен иметь возможность подписаться на это событие.

Возможно ли это? Я хотел бы использовать классы angular2, а не внешние библиотеки.

Мой текущий код:

export class ComponentA 
{ 
    @Output() emitter: EventEmitter<string> = new EventEmitter(); 

    private onFruitSelected():void 
    { 
     this.emitter.emit ("Hello!"); 
    } 
} 


export class ComponentA 
{ 
    constructor():void 
    { 
     // subscribe doJob() to the event 
    } 

    private doJob():void { console.log('event catched'); } 
} 

Спасибо!

EDIT

Я обновил код таким образом:

событий службы обработчика:

export class EventEmitterService 
{ 
    @Output() eventOne: EventEmitter<string> = new EventEmitter(); 
    @Output() eventTwo: EventEmitter<number> = new EventEmitter(); 
} 

Componenta (отправитель события):

export class ComponentA 
{ 
    public constructor(private eventHandler:EventEmitterService) {} 

    private onFruitSelected():void 
    { 
     this.emitter.emit ("Hello!"); 
     this.eventHandler.eventOne.emit ("Hello event one"); 
     this.eventHandler.eventTwo.emit (12); 
    } 
} 

componentB (событие приемник):

export class ComponentA 
{ 
    constructor():void 
    { 
     eventHandler.eventOne.subscribe ((evt:string) => { 
      console.log ('Event one ' + evt); 
     }); 

     eventHandler.eventTwo.subscribe ((evt:number) => { 
      console.log ('Event two ' + evt); 
     }); 
    } 
} 

Это хорошее решение?

Answer 1

Угловая2 не обеспечивает для этого функции. Вы можете использовать услугу пользовательских событий. Смотрите также

• https://github.com/angular/angular/issues/1297
• https://github.com/angular/angular/issues/3186
• https://github.com/angular/angular/issues/1763