AJAX अनुरोध समय-समय पर ऑटो रीफ्रेश होने पर knockout.js डेटा बाध्यकारी का उपयोग कैसे करें?

Question

मेरे आवेदन में मैं समय-समय पर सर्वर से नया अपडेट प्राप्त करने के लिए प्रत्येक 5 सेकंड में AJAX कॉल करता है। [ { "foo": "valx", "बार": "Valy"

}, { "foo"

सर्वर से मेरे ajax डेटा JSON सारणी कि जैसा दिखता है: "valw", "बार": "Valz" } ]

मेरे ajax कोड है:

(function update() { 

    $.ajax({ 
     type : 'GET', 
     url : url, 
     data : { 

     }, 
     dataType : "json", 
     global : false, 
     success : function(content, textStatus, jqXHR) { 
     myViewModel = content; 
     ko.applyBindings(myViewModel); 

     }, 
     complete: function() { 

     setTimeout(update, 5000); 
      }, 

     error: function(xhr, textStatus) { 

      } 
    }); 
    })();      

मेरे HTML है:

<tbody data-bind="foreach: myViewModel"> 
         <tr> 
          <td data-bind="text: foo"></td> 
          <td data-bind="text: bar"></td> 
         </tr> 
        </tbody> 

लेकिन यह काम नहीं करता है और मैं पहली बार ajax कॉल के बाद त्रुटि मिलती है: आप एक ही तत्व के लिए बाइंडिंग कई बार लागू नहीं कर सकते।

Answer 1

आप करीब हैं। आप केवल एक बार applyBindings पर कॉल करें। इसके बजाय आपको अपने दृश्य मॉडल पर observable संपत्ति सेट करना चाहिए।

function ViewModel() { 
    var self = this; 

    self.data = ko.observableArray(); 
}; 

var viewModel = new ViewModel(); 

ko.applyBindings(viewModel); 

तो फिर तुम नए डेटा है जब (उदाहरण के लिए अपने ajax कॉल में):

$.ajax({ 
    success : function(content, textStatus, jqXHR) { 
     viewModel.data(content); 
    } 
}); 

ध्यान दें: आप डेटा एक सेट कर सकते हैं

यहाँ कैसे आप सेटअप आपके विचार मॉडल होगा है कुछ अलग तरीके यदि आप व्यू मॉडल के बाहर अपना टाइम इवेंट चाहते हैं तो आप गुणों का उपयोग करने और उन्हें अपडेट करने के लिए दृश्य मॉडल उदाहरण (मेरे उदाहरण में, viewModel) का उपयोग कर सकते हैं। यदि आप चाहें तो आप अपने दृश्य मॉडल के भीतर समय की घटना डाल सकते हैं और फिर self.data(content) (या कुछ समान) पर कॉल कर सकते हैं।