मैं एक विषम/यहां तक ​​कि कक्षा को कैसे चक्र दूंगा क्योंकि यह वस्तुओं पर लूप करता है?

Question

jquery-tmpl का उपयोग करके, मैं प्रत्येक दूसरे को कक्षा जोड़कर पंक्तियों की प्रस्तुति को पट्टी करना चाहता हूं, इसलिए डेटा ['बिल्ली', 'कुत्ता', 'घोड़ा', 'नोडी'] से यह उत्पन्न होता है:

<li>Cat</li> 
<li class="odd">Dog</li> 
<li>Horse</li> 
<li class="odd">Noddy</li> 

समाधान suggested here किसी ऐसी चीज की शुरुआत की तरह लग रहा था जिसे हमारे द्वारा आसान पाचन के लिए और अधिक परिष्कृत किया जा सकता है।

Answer 1

कोई बात नहीं। हमेशा की तरह बातें Overcomplicating ...

बस इसे पालन के साथ: addClass साथ अजीब चयनकर्ता ...

$('#template').tmpl(data).appendTo('#list') 
$("#list li:odd").addClass('odd') 

Answer 2

बस कुछ परीक्षण और त्रुटियों के बाद समाधान मिल गया। आप अभिव्यक्ति के मूल्यांकन के लिए {{=}} टैग का उपयोग कर सकते हैं:

{{each(i) Animals}}<li class="{{= i % 2 ? 'even' : 'odd'}}">...</li>{{/each}} 

बेशक आप वास्तव में आपकी आवश्यकताओं के अनुरूप करने के लिए इसे संशोधित कर सकते हैं - आप अजीब या यहाँ तक कि के लिए अंदर और प्रिंट रिक्त मान वर्ग डाल सकते हैं।

एक और समाधान एक समारोह का उपयोग करना होगा (jquery tmpl दस्तावेज़ों में इसका उदाहरण है), लेकिन यह बदसूरत है।

Answer 3

@ जॉन मी, मुझे नहीं लगता कि आप अतिसंवेदनशील हैं।

इम्हो टेम्पलेट वह जगह है जहां विषम-वर्ग का जोड़ा होना चाहिए। तर्क और प्रदर्शन के अनुसार।

Here इंडेक्स को नेस्टेड टेम्पलेट के अंदर रखने के लिए एक पैच है। यदि आप अतिरिक्त $ अजीब संपत्ति चाहते हैं तो इसे आसानी से बढ़ाया जा सकता है:

jQuery.map(data, function(dataItem, index) { 
    if(dataItem){ 
     dataItem.$index = index; 
     dataItem.$odd = index % 2 === 1; 
    }