Angular enter submit directive

enter-submit.directive.ts

import { ElementRef, OnInit, Directive, Input } from '@angular/core';

import { Observable, fromEvent } from 'rxjs';
import { distinctUntilChanged, filter, merge } from 'rxjs/operators';


@Directive({
  selector: 'input',
  // selector: '[enter-submit]',
})
export class EnterSubmit implements OnInit {
  @Input() eventName: string = 'keyup';

  constructor(private elementRef: ElementRef) {
  }

  ngOnInit(): void {
    const keyUps = fromEvent(this.elementRef.nativeElement, this.eventName);
    const eventStream = keyUps.pipe(
      merge(keyUps),
      filter((e: KeyboardEvent) => {
        return e.keyCode === 13;
      }),
      distinctUntilChanged((x, y) => {
        return x.type == y.type;
      })
    )

    eventStream.subscribe(
      input => {
        // do your thing
      });
  }

}