बेसिक नॉकआउट जेएस मैपिंग एक एकल JSON ऑब्जेक्ट

Question

मैं नॉकआउट के लिए बहुत नया हूं और नॉकआउट के लाभ प्राप्त करने के लिए एक jquery मोबाइल ऐप बनाना चाहता हूं। मैंने आखिरी दिन दीवार के खिलाफ एक बहुत ही साधारण समस्या के लिए अपने सिर को झुका दिया है .. मैंने तब से कोड हटा दिया है और हाथ से बाध्यकारी मैनुअल के साथ चला गया है (इस प्रकार लगभग jquery पर केओ का उपयोग करने के उद्देश्य को हराया है) .. वैसे भी, अगर कोई मुझे दिखा सकता है कि मुझे केओ की वास्तविक शक्ति का उपयोग करने के लिए क्या करना है, यह मेरे लिए निर्माण करने के लिए एक महान बिंदु होगा।

{"id":9,"fullName":"John Doe","firstName":"John","lastName":"Doe","referenceNumber":"BUY-08","position":"Buyer","type":"Buyer","telephone":"028 82 240780","email":"m@email.com","departmentId":3,"departmentName":"DEPT B","country":"United Kingdom"} 

मेरे एचटीएमएल:

<div> 
    Full Name: <input data-bind="value: fullName" disabled="disabled"/> <br /> 
    Ref: <input data-bind="value: reference" disabled="disabled"/> <br /> 
    Position: <input data-bind="value: position" disabled="disabled"/> <br /> 
    Email: <input data-bind="value: email" disabled="disabled"/> <br /> 
    Dept: <input data-bind="value: departmentName" disabled="disabled"/> <br /> 
    Country: <input data-bind="value: country" disabled="disabled"/> <br /> 
</div> 

मेरे जावास्क्रिप्ट: किसी भी कोड उदाहरण मैं मिल सकता है और अधिक जटिल समस्याओं इस से

मेरे JSON (सरणियों आदि के साथ काम कर) के लिए हमेशा थे

$(document).ready(function() { 

    function DetailsViewModel() { 
     var self = this; 
     self.fullName = ko.observable(""); 
     self.reference = ko.observable(""); 
     self.email = ko.observable(""); 
     self.position = ko.observable(""); 
     self.departmentName = ko.observable(""); 
     self.country = ko.observable(""); 

     var success = function (data) { 
      self.fullName(data.fullName); 
      self.reference(data.referenceNumber); 
      self.email(data.email); 
      self.position(data.position); 
      self.departmentName(data.departmentName); 
      self.country(data.country); 
      $.mobile.loading('hide'); 
     }; 

     webAPICall("api/user/getcurrentuser", 
      "GET", success); // simple wrapper I'm using for ajax calls 

    } 
    ko.applyBindings(new DetailsViewModel()); 
}); 

किसी भी मदद की बहुत सराहना की है, धन्यवाद!

Answer 1

मैपिंग प्लगइन का उपयोग करना बहुत आसान है यदि आपको किसी भी अतिरिक्त फ़ंक्शन की आवश्यकता नहीं है या आपके व्यू मॉडल के लिए गणना नहीं की जाती है। तुम बस ko.mapping.fromJS करने के लिए अपने JSON पारित करना चाहिए:

var viewModel = {}; 

function success(data) { 
    viewModel = ko.mapping.fromJS(data); 
    ko.applyBindings(viewModel); 
} 
webAPICall("api/user/getcurrentuser", "GET", success); 

उपयोग fromJS समारोह अगर डेटा जे एस वस्तु और fromJSON है अगर यह JSON स्ट्रिंग है। और सुनिश्चित करें कि आपके पास data-bind विशेषताओं और json में समान संपत्ति नाम हैं।

यहां उदाहरण के काम कर रहा है: http://jsfiddle.net/axrwkr/5t5fj/50/