Estou usando o Angular 2 para fazer uma diretiva. Eu tenho os seguintes eventos vinculados ao componente host:

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

Também criei dois fluxos e ouvintes na diretiva para gerenciar os dois eventos

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

Eu quero o meusubscribe para ser chamado apenas se omouseenter O evento ainda está ativo após um atraso fixo (ou seja, ummouseleave não ocorreu). Tentei fazer dessa maneira, mas não funciona (o que faz sentido, eu simplesmente não sei como consertar).

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

Alguém com experiência em Angular 2 / RxJS sabe como devo abordar isso?