knockout.js - 我可以为要与 knockout.js 中的 css 绑定绑定的类创建一个选择器吗

Question

有没有比以下更简单的方法来做到这一点：

 <div data-bind="css: { high: selectedPriority() == 1, medium: selectedPriority() == 2}">

我最多有 6 个步骤？另一种是绑定属性类，在js中写洞类列表。

Answer 1

在 Knockout 2.2 中（在 2012 年 10 月 18 日的 RC 中），您可以给css绑定一个类来设置：

<div data-bind="css: priorityClass"></div>

priorityClass然后可以是您的视图模型中的计算 observable：

vm.priorityClasses = {1:'high', 2:'medium' /*...*/};
vm.priorityClass = ko.computed(function() {
    return this.priorityClasses[this.selectedPriority()];
}, vm);

如果您不想要计算的 observable，您可以将该逻辑直接放在绑定中：

<div data-bind="css: priorityClasses[selectedPriority()]"></div>

在 2.2 发布之前，您可以改用类自定义绑定。