綁定多個樣式

Question

我有一個包含其他計算出的值的合併，然後我結合我的元素計算值：

HTML

<td data-bind="text: displayNamePipeJob, attr: primaryStyling()"></td> 

JS

self.primaryStyling = window.ko.pureComputed(function() 
{ 
    return { 
     style: 'color: ' + self.primaryFontColor() + '; font-family: ' + self.fontFamily() 
    } 
}); 

爲了避免以這種方式建立手動字符串的醜陋，是否有這樣的我的方式提供style一些類型的對象具有屬性，例如：

self.primaryStyling = window.ko.pureComputed(function() 
{ 
    return { 
     style: { 
      'color': self.primaryFontColor(), 
      'font-family:': self.fontFamily() 
     } 
    } 
}); 

可悲的輸出到style="[object Object]"。

Answer 1

敲除的目標之一是將視圖與模型分離 - 因此直接從模型返回整個樣式信息可能不完全正確。

我會在模型包含有效配置信息的地方接近它，並且視圖使用它。得心應手，淘汰賽已經用於此目的的style binding：

<td data-bind="text: displayNamePipeJob, style: {color: primaryColor, fontFamily: fontFamily }"></td> 

如果數值在一個更復雜的方式，在這裏你的榜樣，你可以建立個人computed功能，用於每個樣式屬性來計算。