How to make the user panel disappear on click on the external area in angular?

Question

Angular

How to make the user panel disappear on click on the external area in angular?

Answer 1

you can hang an event handler on a click, and when the event fires, do something
like onClick($event) {
if (this.userPanel && this.userPanel.nativeElement.contains($event.target)) {
return
}
/// logic on hide panel
}
then you can remove the click handler and hang it when next. times come in handy