Javascript 通过一个函数和一个绑定来剔除CSS样式

我知道您可以使用knockout根据函数返回设置类，如下所示

<span data-bind="css: styling()"></span>

还可以使用真/假值内联设置它们

<span data-bind="css: {className: $parent.active() == $data}"></span>

有没有一种方法可以在一个绑定中同时完成这两个任务？我的示例是，我希望根据span元素显示的项目类型返回一个自定义类（其中将有许多），但如果选择了它们，我还希望它们高亮显示

似乎无法在对象的右侧使用函数，并且使用两个函数会导致第二个函数覆盖第一个函数

---

有什么想法吗？

通过此示例，您可以指定每个项目的类别

查看

<div data-bind="foreach: items" >
    <span data-bind="css : $parent.styling($data), text: $data"></span>
</div>

<div data-bind="foreach: items" >
    <span data-bind="css : styling, text: name, click : toggle"></span>
    <br/>
</div>

---

编辑：

var vm = {
    items : ['a','b','c' ],

    styling : function(item ) {
        if(item =='a') return 'active';
        if(item =='b') return 'active bold';
        return '';
    }    
};

ko.applyBindings(vm);

@Shadow：你说得对，如果你把一个值传递给一个计算机，它就是设置（或写入）它

我想这会符合你的需要。 在项目上，将调用切换函数。 然后，将更改活动的可观察对象，并最终计算样式

JS

var Item =  function(data) {
    var self = this;
    self.name = data;
    self.active = ko.observable(false);
    self.styling = ko.computed(function(item ) {
        if(self.active()) return 'active';
        return '';  
    });
    self.toggle =  function(){
        self.active(!self.active());
    }
};

var vm = {
    items : [new Item('a'),new Item('b'), new Item('c') ]        
};


ko.applyBindings(vm);

查看

<div data-bind="foreach: items" >
    <span data-bind="css : $parent.styling($data), text: $data"></span>
</div>

<div data-bind="foreach: items" >
    <span data-bind="css : styling, text: name, click : toggle"></span>
    <br/>
</div>

---

Sortof方向正确-但在我的例子中，阵列中充满了子视图。如果我可以从父视图调用子视图中的函数，这个答案可能会起作用。。。你知道你是否能通过它吗？事实上，这似乎不起作用，因为我们没有使用可观察的。这意味着我无法跟踪活动项（从而将样式添加到其中）。据我所知，您不能将参数传递给ko.computed。还有其他想法吗？