如何指定两个css类:from property和conditional class

Question

我知道在knockout中有能力从observable属性中指定类,如下所示:

<div data-bind="css: Color " >

Knockout还提供了指定条件类渲染的功能,如下所示:

<div data-bind="css: { 'my-class' : SomeBooleanProperty  }" >

但是,如果我需要敲除css绑定在一起的那些功能,应该指定哪个标记？

我试过这个,但没有运气:

<div data-bind="css: { Color, 'my-class' : SomeBooleanProperty  }" >

我有错误:

错误:无法解析绑定.SyntaxError:意外的令牌,;

我没有在谷歌或官方文档中找到任何示例.

UPDATE

我找到了一个解决方法:在代码中构建样式字符串并将其放到属性中,如下所示:

item.AdditionalCss(Color() + " " + (result.IsSortable() ? 'my-class' : null));

并在html中指定此类:

data-bind="css: AdditionalCss "

但我有点疑惑,我认为这是肮脏的方法.我认为在标记中获得相同的结果会更好.如何通过标记实现这一目标？

Answer 1

使用类绑定

<div data-bind="class: myClass" >

查看型号:

var vm = {
     myClass : ko.observableArray(),
};
vm.myClass.push('class1');
vm.myClass.push('class2');

您还可以使用带有计算的类绑定.

但如果您不想使用它,您可以这样做:

<div data-bind="attr: { 'class' :( Color() +  (SomeBooleanProperty() ? ' my-class' :'')) }">