2013-04-16 8 views
5

निम्नलिखित नमूना एचटीएमएल देखें। यह एक साधारण केओ foreach बाइंडिंग और observableArray पर एक नया आइटम जोड़ने के लिए एक बटन है। अतिरिक्त जुर्माना काम करता है और नया आइटम दिखाता है। हालांकि, afterRender विधि को कभी भी बुलाया नहीं जाता है - प्रारंभिक बाध्यकारी के बाद नहीं और एक नई वस्तु को जोड़ने के बाद नहीं (और प्रस्तुत किया जाता है)। क्यूं कर?विक्रेता के बाद क्यों नहीं कहा जाता है?

फिडल: क्योंकि foreach बंधन या तो एक सरणी या किसी वस्तु कहां पर अतिरिक्त घटनाओं तर्क निर्दिष्ट करते हैं, लेhttp://jsfiddle.net/CQNm6

एचटीएमएल

<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta charset="utf-8" /> 
     <title></title> 
     <script type="text/javascript" src="http://knockoutjs.com/downloads/knockout-2.2.1.js"></script> 
    </head> 
    <body> 
     <div data-bind="foreach: data.things, afterRender: afterRenderTest"> 
      <h1 data-bind="text: name"></h1> 
     </div> 
     <a href="JavaScript:void(0);" onclick="data.things.push({ name: ko.observable('New Thing') });">Add New Thing</a> 

     <script type="text/javascript"> 
      var Thing = (function() 
      { 
       function Thing(p_name) 
       { 
        this.name = ko.observable(p_name); 
       } 

       return Thing; 
      })(); 
      var data = 
      { 
       things: ko.observableArray(
       [ 
        new Thing("Thing One"), 
        new Thing("Thing Two"), 
        new Thing("Thing Three") 
       ]) 
      }; 

      function afterRenderTest(elements) 
      { 
       alert("Rendered " + elements.length + " elements."); 
      } 

      ko.applyBindings(); 
     </script> 
    </body> 
</html> 

उत्तर

12

आपका वाक्य रचना गलत है।

documentaiton:

से सरणी है कि आप से अधिक पुनरावृति करना चाहते हैं दर्रा। बाध्यकारी प्रत्येक प्रविष्टि के लिए मार्कअप का एक खंड आउटपुट करेगा।

वैकल्पिक रूप से, data नामक एक संपत्ति के साथ एक जावास्क्रिप्ट ऑब्जेक्ट शाब्दिक पास करें, जिस सरणी को आप फिर से चालू करना चाहते हैं। वस्तु शाब्दिक भी इस तरह के afterAdd या includeDestroyed के रूप में अन्य गुण, हो सकता है ...

तो तुम लिखने की जरूरत है:

<div data-bind="foreach: { data: data.things, afterRender: afterRenderTest }"> 
    <h1 data-bind="text: name"></h1> 
</div> 

डेमो JSFiddle.

+0

बेवकूफ मुझे, धन्यवाद! –

संबंधित मुद्दे