एक तत्व पर कई डेटा-बाइंड विशेषताएँ कैसे हैं?


94

मुझे एक तत्व पर कई डेटा बाइंडिंग करने की आवश्यकता है। उदाहरण के लिए, मैं एक टैग पर एक डेटा-बाइंडिंग के साथ- hrefसाथ चाहता हूं । मैंने यह कोशिश की है,html a

<a data-bind="html: name" 
   data-bind="attr: { href: url }" 
   data-bind="attr: { 'data-prop': xyz }">
</a>

लेकिन यह काम नहीं करता है। ऐसा लगता है कि नॉकआउट केवल एक data-bind संपत्ति को बांधने का समर्थन करता है ? एक तत्व पर दोनों hrefआंतरिक html, और एक कस्टम " data-prop" विशेषता को कैसे बांधें ?

जवाबों:


127

ऐशे ही:

<a data-bind="html: name, attr: { href: url }">

आप अल्पविराम से अलग बाइंडिंग का उपयोग करते हैं - विशेषता एक वस्तु को पारित करने के समान है:

{
    html: name, 
    attr: { href: url }
}

या, यदि आप attrएक साथ कई बाइंडिंग के बारे में पूछ रहे हैं :

<a data-bind="html: name, attr: { href: url, 'data-prop': FullName }">

क्या आप मुझे यह भी बता सकते हैं कि, अगर viewModel.tasks = ko.observableArray (tsks) तो viewModel.tasks = [नया ऐरे] बदल रहा है, तो कैसे बताएं कि सरणी बदल गई है
user960567 22/12

ko.observable मान सेट करते समय, इसे इस तरह से करने का प्रयास करें viewModel.tasks([1,2,3]);:। यानी आप इसे एक फ़ंक्शन के रूप में कहते हैं, नए मान को एक पैरामीटर के रूप में पारित करते हैं
paulslater19

2

इस प्रकार मैंने स्रोत विशेषता को लागू किया और डेटा-बाइंड का उपयोग करके ईवेंट पर क्लिक करें। आपको यह उपयोगी लग सकता है।

<img data-bind="{click: function(data, event) {ESVendorWidget.loadFunction(data,event)},
                 attr: {src: $data.Photo.PhotoUrl }}"
     alt="package pic" class="big" />

1

मैं बस का उपयोग करें:

<input type="checkbox"
    data-bind="click: callFunction(), checkedValue: 0, checked: Card.Days">

एक चेकबॉक्स तत्व के लिए।


1

आप , नीचे की तरह उपयोग करके कई गुणों का उपयोग कर सकते हैं

<a data-bind="attr: { href: url, id: id , class: classvalue}">

इस तरह की वस्तु

{ url: 'http://stackoverflow.com', id:'newid' , classvalue: 'classname' }
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.