I have a component that calls the emit function passing some vars and html with (click) as followed:

change_RollOver(rollOverField, clickedPlan){ let modalDiv:any = ""; let modalContent:any = ""; if(clickedPlan == this.currentPlanId){if(rollOverField == 0){this.modalTitle = "Confirm Cancellation";modalContent = "Content here"; }else{this.modalTitle = "Confirm Activation"; modalContent = "Content here"; }modalDiv = modalDiv+"<div class='p-0-24'><div class='row border-top pt-3 pb-3'><div class='col-md-12'>";modalDiv = modalDiv+"<div class='col-md-12 pb-3 pl-0 pr-0 simple-text'>"+modalContent+"</div><button class='btn primary green btn-medium float-left' (click)='"+this.closeModal.emit()+"'>Yes</button>";modalDiv = modalDiv+"<button class='btn primary green btn-medium float-right' value='CloseThisModal'>No</button>";modalDiv = modalDiv+"</div></div></div>"; this.modalContent = this.sanitizer.bypassSecurityTrustHtml(modalDiv); }this.isOpenFN.emit({modalTitle:this.modalTitle, modalDiv:this.modalContent});}

Then after the EMIT being called, I display the content in the parent component:

isOpenFN(content){ this.isOpen = true; this.modalTitle = content.modalTitle; this.modalContent = content.modalDiv;}

It displays the HTML just fine but as you can see (click) was supposed to have another emit() but when I check the code on that popup is changes the (click) value to “undefined”. Any idea of how I can detect if that button is clicked to call an action?

Button should emit()