knockoutjs नेस्टेड फोरैच

Question

में काम नहीं कर रहे बाध्यकारी पर क्लिक करें, इसलिए मेरे पास एक नॉकआउटज के साथ वास्तव में अजीब समस्या है जो एंकर टैग से जुड़ा हुआ बाध्यकारी क्लिक करें। अन्य डेटा-बाइंड = "" काम करता है लेकिन क्लिक बाध्यकारी नहीं है।

आप नीचे viewmodel js के एचटीएमएल और हिस्सा देख सकते हैं फ़ाइल

var tag = function (data) { 
    this.count = data.Count; 
    this.id = data.Id; 
    this.title = data.Title; 
    this.tagGroup = data.TagGroup; 
}; 
var tagContainer = function (data) { 
    this.tagList = $.map(data.Tags, function (item) { return new tag(item); }); 
    this.letter = ko.observable(data.Letter); 
}; 

var searchViewModel = function(){ 
    var self = this; 

    self.tagContainerList = ko.observableArray([]); 

    self.addFilter = function (tag) { 
    //move tag to active filters and do some more cool stuff here 
    }; 


}; 

<div id="modal-all-tags" data-bind="with:searchViewModel"> 
    <ul data-bind="foreach:tagContainerList"> 
     <li> 
      <span data-bind="text:$data.letter()"></span> 
      <ul data-bind="foreach:tagList"> 
       <li><a href="#" data-bind="click:$root.addFilter"><span data-bind="text:title"></span></a></li> 

      </ul> 
     </li> 
    </ul> 

     <a class="close-reveal-modal">&#215;</a> 
</div> 

मूल रूप से यह एक मॉडल पॉपअप है और इसकी भरी हुई है जब उपयोगकर्ता पृष्ठ पर एक लिंक पर क्लिक करता। मैं सर्वर के लिए एक अनुरोध भेजने और यह मेरे टैग कंटेनरों की एक सूची प्रत्येक है शुरू करने पत्र और टैग की सूची इस तरह पत्र नीचे प्रदान करने देता है: एक एक शब्द 1 एक शब्द 2 बी ख शब्द 1 ख शब्द 2 सी ग शब्द 1 ग शब्द 2

और इतने पर ...

पत्र सही ढंग से गाया जाता है ए, बी, सी और प्रत्येक सही टैग सूची के साथ उन्हें नीचे प्रदान की गई हो जाता है पाठ: सही ढंग से प्रदर्शित शीर्षक।

सब कुछ addFilter() को छोड़कर काम करता है; कार्य करें कि मैं टैगलिस्ट में प्रत्येक लिंक से जुड़ना चाहता हूं। ब्राउज़र बस कूदता है और यूआरएल में हैश चरित्र जोड़ता है। फायरबग बाइंडिंग पर कोई भी त्रुटि नहीं दिखा रहा है।

div कंटेनर के साथ कारण है: searchViewModel क्योंकि पूरे पृष्ठ के लिए एक मास्टर व्यूमोडल है। लेकिन इससे कोई फर्क नहीं पड़ता क्योंकि यह परियोजना के हर दूसरे पेज पर काम कर रहा है।

एकमात्र चीज जो मैं सोच सकता हूं वह है कि $ root.addFilter बाध्यकारी क्लिक गलत है, लेकिन मैंने केवल addfilter की कोशिश की जहां फायरबग त्रुटि देता है "addFilter परिभाषित नहीं किया गया है;"

और मैंने $ $ माता-पिता और $ रूट दोनों की कोशिश की।

क्या किसी के पास कोई सुझाव है?

Answer 1

एक विचार मैंने किया था। आपका addFilter समारोह एक पैरामीटर (tag) को उम्मीद है लेकिन आप बंधन में यह कुछ भी गुजर नहीं हैं:

<a href="#" data-bind="click:$root.addFilter"> 

इस समस्या हो सकता है?

शायद की तर्ज पर कुछ:

<a href="#" data-bind="click:function() { $root.addFilter($data) }"> 

मदद मिलेगी?

Answer 2

मैं कुछ इसी तरह से भाग गया और पहले मैं data-bind="click:function() { console.log($parents) }" चला गया। ध्यान दें कि इसकी $parents$parent नहीं है। मैंने संदर्भ ढूंढना देखा, और जिसकी मुझे आवश्यकता थी, उसे data-bind="click:$parents[1].onCardClick"