好き嫌いでイオンアイコンの色を動的に変更

Question

プロジェクトの気に入ったときや嫌いなときにアイコンの色を変えることに問題がありました。私の悩みは何ですか？動的にあなたが本当に2つのアイコンを作成する必要はありません色を変更するための HTML

<ion-icon *ngIf="!project.likedBy" color="dark" name="heart"> 
</ion-icon> 

<ion-icon *ngIf="project.likedBy" color="danger" name="heart"> 
</ion-icon> 
<span>{{project.numLikes}}</span> 

Answer 1

。下記のように色を動的に変更する式を書くことができます。

<ion-icon [color]="project.likedBy ? 'danager' : 'dark'" name="heart"> 

またlikedByプロパティがブール値であることを確認してください。そうでなければ、条件を調整して色文字列を設定する必要があります。