knockout.js - using knockout to set css class with an if condition

Question

I want to set a bootstrap css class to a span with if condition (up to the binded value). I have isApproved field in a list , I want to see the field with 'label-success' class when its active and 'label-important' class when its inactive

I added this line , but all the time its taking the first class :

data-bind="text: isApproved, css: isApproved = 'true' ? 'label label-important' : 'label label-important'"

Is it possible in the html or I should add a computed field on my VM?

question from:https://stackoverflow.com/questions/17970313/using-knockout-to-set-css-class-with-an-if-condition

Answer 1

If I understood you right, this is the binding you are looking for.

 data-bind="text: isApproved, css: {
    'label' :  true,
    'label-success' :  isApproved(),
    'label-important':  !isApproved()
 }"

I hope it helps.