Как я могу сделать условную привязку в knockout.js?

Я попробовал следующее:

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

Но это не работает:)

Ответы

Ответ 1

Предполагая, что у вас есть это:

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

Добавить() после itemSelected, чтобы получить текущее значение наблюдаемого, которое вы можете использовать с тернарным оператором:

<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/

Ответ 2

После работы для меня я использовал атрибуты css и id, для меня это не работало, если атрибут css не является первым, поэтому сохраните атрибут css как ваш первый.

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

...
...
...

</div>