좋아요/싫어요에서 이온 아이콘 색상을 동적으로 변경하십시오.

Question

프로젝트를 좋아하거나 싫어할 때 아이콘 색상을 변경하는 데 문제가 있습니다. 내 맘대로 내 문제가 된 것 같니? 당신이 정말로하지 않는 동적으로 변화하는 컬러를 들어 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

2 개 아이콘을 만들 필요합니다. 아래와 같이 표현식을 작성하여 색상을 동적으로 변경할 수 있습니다.

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

는 또한 likedBy 속성은 부울 값이 있는지 확인합니다. 아니면 색상 문자열을 설정하기 위해 조건을 조정해야 할 수도 있습니다.