क्या आप नॉकआउटज शैली बाध्यकारी को संपत्ति + मूल्य निर्दिष्ट कर सकते हैं?

Question

मुझे शैली बाध्यकारी के बारे में एक सवाल है। क्या पूरे स्टाइल बाइंडिंग टेक्स्ट को उत्पन्न करना संभव है? तो संपत्ति और मूल्य भागों एक साथ? उदाहरण के लिए:

function ViewModel() { 
    this.fontSize = ko.observable(12); 

    this.fontSizeCSS = ko.computed(function() { 
     return "font-size: " + " " + this.fontSize() + "px"; 
    }, this); 

} 

// Activates knockout.js 
ko.applyBindings(new ViewModel()); 

आसान तरीका इस तरह करना है:

<div data-bind="style: { fontSize: fontSize() + 'px'}"> 
    <p>Lorem ipsum</p> 
</div> 

क्या यह संभव है यह (मैंने कोशिश की, यह काम नहीं किया था) इस तरह एक तरह से करने के लिए:

<div data-bind="style: { fontSizeCSS() }"> 
    <p>Lorem ipsum</p> 
</div> 

यदि हां, तो कैसे? यदि नहीं, तो क्यों नहीं? कोई एचटीएमएल शैली तत्व के लिए बाध्यकारी पाठ कर सकता है, लेकिन मैं सोच रहा था कि क्या आप इसे कुछ हद तक समान कर सकते हैं, मैं क्या प्रस्तावित कर रहा हूं? धन्यवाद!

Answer 1

style binding का मुख्य पैरामीटर string नहीं है, लेकिन

आप एक जावास्क्रिप्ट वस्तु जिसमें संपत्ति के नाम शैली के नाम के अनुरूप पारित करना चाहिए, और मूल्यों शैली मूल्यों आप चाहें के अनुरूप लागू करने के लिए।

तो अपने fontSizeCSS गणना की एक वस्तु और न कोई स्ट्रिंग लौट जाना चाहिए, और यह ठीक काम करेगा:

this.fontSizeCSS = ko.computed(function() { 
     return {"fontSize": this.fontSize() + "px"}; 
}, this); 

डेमो JSFiddle।