Set style dynamically in Angular

[style.background-color]="activity.status == 'Pending' ? 'red' : 'green'"

[ngStyle]="{'backgroundColor': activity.status == 'Pending' ? 'red' : 'green' }"

For your rendering result see also In RC.1 some styles can't be added using binding syntax

Try this one:

[ngStyle]="{'border': user?.keyResults.percentage > 50 ? '3px solid green' : '3px solid red' }"

Related