Как добавить динамический класс в knockoutjs?

Скажем, что у меня есть

<span class="cls1 cls2" data-bind="title: title" ></span>

Я хочу добавить другой класс через объект JSON,

{ title: 'a', clas: 'cls3' }

Эта работа,

    <span class="cls1 cls2" data-bind="attr:{title: title,'class': 'cls1 cls2'+clas}" ></span>

Но проблема в том, что он добавит два атрибута класса. Мне нужно класс cls1 и cls2 при начале. Но нужно класс cls3 после некоторого события.

Ответы

Для этого следует использовать css привязку вместо attr. Подробнее об этом в документации: http://knockoutjs.com/documentation/css-binding.html.

Код будет выглядеть примерно так:

<span class="cls1 cls2" data-bind="text: title, css: myClass" ></span>

Здесь работает скрипка: http://jsfiddle.net/vyshniakov/gKaRF/

Использование нескольких классов:

<span
    class="yourClass"
    data-bind="css: { myClass: (true == true), theirClass: (!true == false), ourClass: true }"
>Thine Classes</span>

Для этого можно использовать привязку css:

<span class="cls1 cls3" data-bind="css: clas"/>

Это добавляет значение вашего свойства "clas" к текущему набору классов элемента