Angular click event not firing
Solution 1
Ok, so after some more inspecting on the code, it seems that the problem was because of font awesome that it just commented the span and inserted a svg at runtime, so the (click) pointer was not available anymore. The solution was to wrap the span in a div and put the click event on the div like this:
<div class="icon-wrapper" (click)="edit(meci)">
<span class="fas fa-edit teal icon"></span>
</div>
Solution 2
Change the postion to relative and give some z-idex, issue can be because some other classes overlaping your span
Related videos on Youtube
rares_dude
Updated on June 04, 2022Comments
-
rares_dude almost 2 years
I have a piece of code generated inside of an *ngFor, and a span with a (click) event that I can't figure why it does not fire when I click it. It does not print anything in the console.
Can this be because of the ngFor or ngIf ? I've tried everything I can think of...
My template looks like this (the relevant part):
<tbody> <ng-container *ngIf="matches"> <tr *ngFor="let meci of matches"> <td>{{ meci.id }}</td> <td>{{ meci.echipa1 }}</td> <td>{{ meci.echipa2 }}</td> <td>{{ meci.tip }}</td> <td>{{ meci.pretBilet }}</td> <td>{{ meci.nrLocuri }}</td> <td>{{ meci.data }}</td> <td class="ui center aligned"> <span class="fas fa-trash red icon"></span> <span class="fas fa-edit teal icon" (click)="edit(meci)"></span> </td> </tr> </ng-container> </tbody>
And the component like this:
export class MatchesComponent implements OnInit { matches: Meci[]; constructor(private service: MatchesService, private modalService: SuiModalService) { } ngOnInit() { this.service.getAll().subscribe(matches => this.matches = matches); } edit(meci: Meci) { console.log('edit'); } }
-
Sajeetharan almost 6 yearsdid it work for you
-
-
Sankofa about 4 yearsThis wasn't my problem but it forced me to look closer at my code. I forgot to invoke the function in the HTML. :) smh. Taking a break and coming back to the code helps when start getting tired. Thanks for posting.
-
Leroy Meijer almost 3 yearsSame, this wasn't my problem either, but (Click) is something different the (click).... Thanks for making me look at my code again ;)