简体   繁体   中英

ngClass if statement multiple expressions not working

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>

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>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM