observable-host-listener-5.ts

import { HostListener } from '@angular/core';
import { Subject, UnaryFunction, Observable } from 'rxjs';

export function ObservableHostListener(): PropertyDecorator {
  return (target: any, key: string) => {
  
    // The stuff we did earlier ...

    // Patch ngOnDestroy so we can correctly complete our subject.
    patchOnDestroy(target, subject);

    // Call our preparedDecorator with the target class and our super secret key,
    // so Angular wires the event to our monkey patched method instead of our
    // decorated key.
    preparedDecorator(target, newKey);
  }
}

function patchOnDestroy(target: any, subject: Subject<any>) {
  const oldOnDestroy = target['ngOnDestroy'] || (() => undefined);
  target['ngOnDestroy'] = () => {
    subject.complete();
    oldOnDestroy();
  }
}