This is my code in HTML
<ion-col style="background:#ffffff" size="6" *ngFor="let item of data; index as i">
<ion-card>
<ion-col size="6">
<img src="" />
<ion-row>
<ion-col size="6">
$300.00
</ion-col>
<ion-col size="6" class="ion-text-end">
<ion-icon [name]="hello" (click)="change(item.id)" [color]="color" id="{{item.id}}"></ion-icon>
</ion-col>
</ion-row>
</ion-col>
</ion-card>
</ion-col>
My TS
hello = "ios-heart";
color = "";
change(){
if (this.hello === "ios-heart" && this.color === ""){
this.hello = "ios-heart";
this.color = "danger";
}
else{
this.hello = "ios-heart";
this.color = "";
}
}
How can I get the value of the id of ion-icon (id="{{item.id}}") if the value is dynamic? I am trying to make a heart like me but the moment I press they all light up then I have to differentiate which heart is the one that I have to light up can you help me?