Я использую Angular 2, чтобы сделать директиву. У меня есть следующие события, связанные с компонентом хоста:

host: {
    '(mouseenter)': 'onMouseEnter($event)',
    '(mouseleave)': 'onMouseLeave($event)'
}

Я также создал два потока и слушателей по директиве для управления двумя событиями

export class PopupDirective {
    private _mouseEnterStream: EventEmitter<any> = new EventEmitter();
    private _mouseLeaveStream: EventEmitter<any> = new EventEmitter();

    onMouseEnter($event) {
         this._mouseEnterStream.emit($event);
    }

    onMouseLeave($event) {
         this._mouseLeaveStream.emit($event);
    }
}

Я хочу моеsubscribe быть вызванным только еслиmouseenter событие остается активным после фиксированной задержки (т.е.mouseleave не произошло). Я пытался сделать это таким образом, но это не работает (что имеет смысл, я просто не знаю, как это исправить).

this._mouseEnterStream.flatMap((e) => {
  return Observable
    .of(e)
    .takeUntil(this._mouseLeaveStream);
}).delay(2000).subscribe(
  () => console.log('yay, it worked!')
);

Кто-нибудь с опытом работы с Angular 2 / RxJS знает, как мне к этому подойти?