angular.io: как исключить узлы родительского компонента из слушателя узла в дочернем компоненте

Question

Следующий сценарий: есть компонент, содержащий кнопку удаления ( PARENT component ). Если пользователь нажимает на эту кнопку, он должен открыть простое модальное подтверждение ( CHILD компонент ). Клик за пределами этого модального режима должен снова закрыть модальное подтверждение. Я попытался понять это и создал хост-слушатель для дочернего компонента (модальный), но не знаю, как исключить кнопку, которая находится в родительском компоненте.

@HostListener('document:click', ['$event.target'])
public onClick(targetElement) {
  const clickedOutside = !this.elementRef.nativeElement.contains(targetElement);

  // needs to be extended to exclude the button in parent component 
  if (clickedOutside && this.display) {
    console.log('host listener - closing modal');
    // this.close(false);
  }
}

Кто-нибудь знает, как решить эту проблему? Вот ссылка на простое угловое приложение: https://stackblitz.com/edit/angular-nbmfee

Или есть лучший способ решить это. Заранее спасибо.