knockout.js - Knockout css binding 渲染 => class=" 0 1 2 3 4 5 6 with KO 2.0

Question

我用这段代码得到一个奇怪的样式文本：

self.styleClass = ko.computed(function () {
            return self.isFollowing() ? "button" : "secondary button";
        });

      <button data-bind="text: followButtonText,click: toggleIsFollowing, css: styleClass"></button>

它呈现：

<button data-bind="text: followButtonText,click: toggleIsFollowing, css: styleClass" class=" 0 1 2 3 4 5 6 7 8 9 10 11 12">Unfollow</button>

model.styleClass() 在控制台中呈现良好

Answer 1

绑定的语义css已从 KO 2.1.0 更改为 KO 2.2.0

从Knockout 2.2.0 发布：

我们还使一些功能更像您一直认为它们应该工作的那样工作。例如，css 绑定现在可以将编程生成的 CSS 类名附加到元素（以前，它仅限于切换预定义的 CSS 类名）。

所以升级到KO 2.2.1就可以了。

如果您无法升级，您可以使用attr绑定作为解决方法：

<button data-bind="text: followButtonText, 
                   click: toggleIsFollowing,
                   attr:{ class: styleClass}" />

演示JSFiddle 使用 KO 2.0.0 和 attr 绑定