How to detect on click event on dynamically added element in angular 6

Question

I want to attach on click event to dynamically added li tag in angular I tried renderer also,

 const classArr: any = document.querySelectorAll('.highlight');
    classArr.forEach(element=>{
      this.render.listen(element, 'click', (target)=>{
        console.log('clicked', target);
      })
    });

but its not working on dynamic element.

Please help.

Answer 1

 use event binding <ul> <li*ngFor="let i of slectedproduct"; let i = index> <span (click)="show(i)">{{slectedproduct.name}}</span> </li> </ul> binding and calling` `selectedevent; show(ind){ this.selectedevent = this.selectedproduct[ind]; }