title: Angular. How to define a click outside, excluding sub-components?
body: <p>everyone!</p>
  
  <p>There is a code for determining the click outside the component</p>
  
  <pre><code>@HostListener('document:click', ['$event', '$event.target'])
  public onClick($event, targetElement) {
      const isClickedInside = this._elementRef.nativeElement.contains(targetElement);
      if (!isClickedInside) {
          this.onClickOutsideEvent.emit($event);
      }
  }
  </code></pre>
  
  <p>Why is the click defined outside, if clicked inside, but on the nested component?</p>