ngClass if statement multiple expressions not working

208 views Asked by At

I would like to give the the class 'bg-green' to the div when 'task.taskChecked' is true. This works, and also when 'task.taskDescription' has the word 'afspraak' the class should be 'bg-purple' this also works.

But with what I am struggling is, when 'task.taskChecked'is true AND 'task.taskDescription' contains the word 'afspraak' also give it the class 'bg-green'

Here is the code:

<div class="tableCell taskIndicator" data-ng-class="{'bg-green': task.taskChecked == true || ( task.taskChecked == true && task.taskDescription.toLowerCase().indexOf('afspraak') > -1 ), 'bg-red': task.taskChecked == false, 'bg-purple': task.taskDescription.toLowerCase().indexOf('afspraak') > -1}">

</div>

SOLUTION:

<div class="tableCell taskIndicator" data-ng-class="{'bg-green': task.taskChecked, 'bg-red': task.taskChecked == false, 'bg-purple': task.taskDescription.toLowerCase().indexOf('afspraak') > -1&&!task.taskChecked}">

</div>
1

There are 1 answers

2
AudioBubble On

order is important while writing your expression.

<div class="tableCell taskIndicator"  data-ng-class="{'bg-red':
task.taskChecked == false, 'bg-purple':
task.taskDescription.toLowerCase().indexOf('afspraak') > -1,
'bg-green': task.taskChecked == true || ( task.taskChecked == true &&
task.taskDescription.toLowerCase().indexOf('afspraak') > -1 )}">

</div>