如何在knockout.js中创建条件绑定？

Question

我试过这个：

<div data-bind="attr: {class: itemSelected? 'selected' : 'unselected' }"></div>

但它不起作用:)

Answer 1

假设你有这个：

function viewModel() {
    this.itemSelected = ko.observable(true);
}
ko.applyBindings(new viewModel());​

在itemSelected之后添加一个（）以获取可以与三元运算符一起使用的observable的当前值：

<div data-bind="attr: { class: itemSelected() ? 'selected' : 'unselected' }"></div>​

http://jsfiddle.net/RK7Ty/

---

如果您不需要为非选定状态指定未选择的类，则可以改为：

<div data-bind="css: { selected: itemSelected }"></div>​

http://jsfiddle.net/RK7Ty/1/

Answer 2

以下为我工作，我正在使用css和id属性，对我而言，如果css属性不是第一个属性，它确实无效，所以请将css属性保留为第一个属性。

<div class="panel-collapse collapse" data-bind="css:{in:$index()==0}, attr: { id:'collapse'+$index()} ">

...
...
...

</div>