Knockout.js "if Binding" on multiple booleans

When Knockout processes your bindings it first evaluates your expression.

If the expression results in an observable, it then evaluates the observable as a convenience to get the final value that the if: works on.

So the two following work identically

<div data-bind="if: foo"></div>
<div data-bind="if: foo()"></div>

Once you leave the world of simple expressions ending in an observable, you probably also want to leave the sugar behind and always evaluate the observables yourself (for sanity if nothing else).

Try the following

<div data-bind="if: (property.aTrueValue() && property.anotherTrueValue())">...

You can - the if binding just takes an arbitrary expression. When doing more than just referencing the value of an observable like that, you'll need to actually call the observable like so:

<div data-bind="if: (property.aTrueValue() && property.anotherTrueValue())">...

Here's a working jsfiddle.