使用函数敲除CSS数据绑定？

Question

我有以下工作代码,使用Knockout来确定在2012年总统选举中呈现状态的颜色.如果状态值为1(共和党人),则颜色为红色.如果状态值为2(民主党人),则颜色为蓝色.如果状态值为3(Toss Up),则颜色为黄色.

<div class="el-clickable" data-bind="css: { 
'el-republican': model.ny()===ip.constants.electoralStatusValue.republican, 
'el-democrat': model.ny()===ip.constants.electoralStatusValue.democrat, 
'el-tossup': model.ny()===ip.constants.electoralStatusValue.tossUp 
}" 
state-abbrev="ny" style="top:26px;left:442px;height:102px;width:54px;" title="New York">
<div style="margin-top:46px;">NY</div></div>

<div class="el-clickable" data-bind="css: { 
'el-republican': model.pa()===ip.constants.electoralStatusValue.republican, 
'el-democrat': model.pa()===ip.constants.electoralStatusValue.democrat, 
'el-tossup': model.pa()===ip.constants.electoralStatusValue.tossUp 
}" 
state-abbrev="pa" style="top:107px;left:372px;height:65px;width:65px;" title="Pennsylvania">
<div style="margin-top:23px;">PA</div></div>

问题是,这似乎是一个强力解决问题的方法,因为我需要有3个单独的CSS绑定调用才能获取单个CSS选择器.也就是说,我需要在我的选举大学地图上检查每个州的共和党人,民主党人和共和党人.

(现实世界的情况更糟糕,因为我实际上检查的是共和党人,倾向于共和党人,民主党人,倾向民主党人,未定,折腾和锁定!)

http://www.ipredikt.com/contests/election2012

我真正想要的是通过调用实用程序函数并传入状态值来实现此目的的方法,如下所示:

data-bind="css: getStateColor(model.pa())" // for Pennsylvania

这是否适用于'attr'绑定？

我经常觉得CSS绑定机制:'string-literal',true | false 是非常严格的.我希望Knockout也支持以下内容:

data-bind="css: myFunction(myParam)"

Answer 1

即将推出的 Knockout 2.2（2012 年 10 月 26 日）将通过css绑定支持此功能。在此之前，您可以使用此class绑定来执行相同的操作。