One of my challenges involves implementing a dropdown function that should be activated with a click on this specific div
<div (click)="toggleDropdown($event)" data-id="userDropdown">
Username <i class="mdi mdi-chevron-down"></i>
</div>
Unfortunately, the click event does not seem to trigger when I click on the <i>
element within the div
toggleDropdown($event) {
const id = $event.target;
document.querySelector('[data-drop=' + id.getAttribute('data-id') + ']').classList.toggle('active');
}
I am looking for a way to ensure that the child click event can also activate the parent event. Any suggestions?