knockout string comparison in if data-binding

Question

The category variable is defined as ko.observable() and child value should be changed according to category value.
Below if statement always returns false.

<!-- ko if: $parent.category == "Electronics"-->
   <div>abc</div>
<!--/ko-->

the if satement below also always returns false:

<span data-bind="if: $parent.category == 'Electronics'">
   <div>abc</div>
</span>

How to do comparison in data-binding with hard-code values?

Answer 1

KO observables are functions and to get their value inside expressions you need to call them without any argument e.g.: $parent.category()

So you need to change your code to:

<!-- ko if: $parent.category() == "Electronics"-->
   <div>abc</div>
<!--/ko-->

In your original code you are comparing the observable function ($parent.category) and not its value with "Electronics" that is why its always false.