Angular - Custom directive when clicking outside specific element

angular-custom-directive-click-outside-element.ts

@Directive({
  selector: '[clickOutsideElement]'
})
export class ClickOutsideDirective {

  @Output() clickOutside = new EventEmitter<void>();
  constructor(private elementRef: ElementRef) { }

  @HostListener('document:click', ['$event.target'])
  onClickOutsideElement(target) {
    const clickedInside = this.elementRef.nativeElement.contains(target);
    if (!clickedInside) {
      this.clickOutside.emit();
    }
  }
}