您可以使用attr
绑定来设置类(如@david.s 建议的那样),但是当我有这种类型的逻辑时,我倾向于将它放在 custombindingHandler
中。
我会让 viewModel 公开一些状态信息,这些信息将确定(在这种情况下)边框颜色,但不直接与类关联:
this.state = ko.observable("complete"); //complete, pending, or cancelled (for example)
然后我将使用绑定处理程序将其映射到类
ko.bindingHandlers.stateStyle = {
update: function(element, valueAccessor) {
var state = ko.utils.unwrapObservable(valueAccessor());
if (state === "completed") {
$(element).addClass("hasGreenBorder"); //again, just an example
}
else if (state === "pending") {
//etc
}
}
}
然后我会在元素上使用新的绑定
<div data-bind="stateStyle: state"></div>
这种方法意味着视图模型没有直接引用 css 类(这对我来说感觉不对),并且state1 => green border
视图的内联绑定中没有定义逻辑。