切换CSS类KnockoutJS

我有一个月的链接切换CSS类KnockoutJS

<ul data-bind="foreach: factMonthes"> 
    <li data-bind="click: $root.changeFactMonth, css:{'selected-month': num == $root.activeFactMonth()}"> 
</ul>

我想禁止类“选择月份”的所有环节，除了积极支持主动点击后。当然，我可以在我的方法changeFactMonth（）中禁用类，但是我可以使用knockout绑定吗？

function FactMonth(num){ 
    this.num = num; 
    this.name = MonthesNames[num - 1]; 
    this.active = false; 
} 

function ViewModel() { 

    self.factMonthes = ko.observableArray();  
    self.activeFactMonth = ko.observable(new Date().getMonth() + 1); 

    for(var i = 1; i <= 12; i++) 
    { 
     var month = new FactMonth(i); 
     month.active = self.activeFactMonth() == i; 
     self.factMonthes.push(month); 
    } 
}

来源

2012-10-29 Ozerich

你在绑定文本中有一个额外的'：'''activeFactMonth（））' – Tomalak

它不是真正的代码，语法错误不重要 – Ozerich

如果month_num是可观察到的，那么你需要解开它：

<li data-bind=" 
    click: $root.changeFactMonth, 
    css:{'selected-month': month_num() == $root.activeFactMonth()} 
">

您可以直接使用观测，只有当你不使用它们作为表达的一部分。由于比较（==）是一个表达式，因此您必须使用基础值，即您必须调用observable。

来源

2012-10-29 10:02:09 Tomalak

不，这个月的num是不可观察的。对象Factmonth是可观察的。请看我的帖子的更新。 – Ozerich

@Ozerich只需将'FactMonth'的'active'属性设置为observable（'this.active = ko.observable（false）;'）即可。绑定你的CSS到那个可观察的（'data-bind =“css：{'selected-month'：active}”'）。完成。当然，不要忘记修改'changeFactMonth（）'，以便它不会执行'month.active = true;'，而是'month.active（true）;' – Tomalak

是的，它是正确的。 Css在月份激活时启用，但CSS类不会在set属性设置为false后删除; – Ozerich

切换CSS类KnockoutJS

回答

相关问题