2012-12-30 7 views
6

मान लिया जाये कि मैं इस तरह एक डेटा संरचना है:Recursion doT.js साथ

{ list: [ { 
     name: "1", 
     children: [{ 
       name: "1.1", 
       children: [] 
      }, 
      { 
       name: "1.2", 
       children: [{ 
        name: "1.2.1", 
        children: [] 
        } 
       ] 
      } 
     ] 
     }, 
     { 
     name: "2", 
     children: [{ 
       name: "2.1", 
       children: [{ 
        name: "2.1.1", 
        children: [] 
        },   
        { 
        name: "2.1.2", 
        children: [] 
        },    
        { 
        name: "2.1.3", 
        children: [] 
        } 
       ] 
      }, 
      { 
       name: "2.2", 
       children: [] 
      }, 
      { 
       name: "2.3", 
       children: [] 
      } 
     ] 
     }, 
     { 
     name: "3", 
     children: [{ 
       name: "3.1", 
       children: [] 
      } 
     ] 
     } 
    ] 
} 

मैं doT.js कि रिकर्सिवली वस्तु के माध्यम से जाने के लिए और नेस्टेड सूची बनाने के साथ एक टेम्पलेट कैसे बनाते हैं?

एक पुनरावर्ती समारोह के साथ जे एस में सीधे HTML स्ट्रिंग बिल्डिंग सीधे आगे पर्याप्त है: (http://jsfiddle.net/fergal_doyle/WN8hZ/5/)

var html = ""; 
function buildList(a){ 

    if (a.length == 0){return}; 

    html += "<ul>"; 
    for (var i = 0; i < a.length; i++) 
    { 
     html += "<li>" + a[i].name; 
     buildList(a[i].children); 
     html += "</li>"; 
    } 
    html += "</ul>";    
} 
buildList(data.list); 

$("#out").html(html); 


लेकिन doT.js के साथ इस मैं क्या है और उसके बाद मैं स्टंप्डया हूँ ! (http://jsfiddle.net/fergal_doyle/BTZpu/4/)

संपादित करें: मैं मूल्यांकन (http://jsfiddle.net/fergal_doyle/he8AN/) के साथ कुछ जे एस में मिश्रण से यह कर सकते हैं

{{ function buildList(a) { }} 

    {{?a.length}} 
    <ul> 
     {{~a :v}} 
     <li> 
      {{=v.name}} 
      {{ buildList(v.children); }} 
     </li> 
     {{~}} 
    </ul> 
    {{?}} 

{{ } }} 

{{ buildList(it.list); }} 

मैं partials का उपयोग कर इसे प्राप्त करने के लिए कोशिश कर रहा था। एक उल स्निपेट को परिभाषित करने के बाद उस स्निपेट को खुद को एक सरणी के रूप में एक सरणी में गुजरने के लिए बुलाया जाता है, लेकिन मुझे "बहुत अधिक रिकर्सन" त्रुटि मिल रही है। यदि नीचे काम करने के लिए कोई रास्ता है, तो उपरोक्त की तुलना में यह बहुत साफ है। (http://jsfiddle.net/fergal_doyle/qazGe/4/)

{{##def.ul:a: 
    <ul> 
    {{~a :value}} 
     <li>{{=value.name}}{{#def.ul:value.children}}</li> 
    {{~}} 
    </ul> 
#}} 

{{#def.ul:it.list}} 

उत्तर

3

समस्या संकलन समय पर है। doT.js आंशिक रूप से रिकर्सन को संभालने में प्रतीत नहीं होता है। आप कोड {{#def.ul:value.children}} रिकर्सन करते हैं doT.js लाइब्रेरी को आपके फ़ंक्शन की सामग्री के साथ असीमित रूप से हल/प्रतिस्थापित करता है। इसके आस-पास जाने का एक तरीका है arguments.callee का उपयोग अपने आंशिक के भीतर अपने आंशिक के संदर्भ में करना है।

function resolveDefs(c, block, def) { 
    return ((typeof block === 'string') ? block : block.toString()) 
    .replace(c.define || skip, function(m, code, assign, value) { 
     if (code.indexOf('def.') === 0) { 
      code = code.substring(4); 
     } 
     if (!(code in def)) { 

      // HANDLE RECURSION START 
      value = value.replace(c.use || skip, function(m, recursiveCode) { 
       if (c.useParams) return recursiveCode.replace(c.useParams, function(m, s, d, param) { 
        if(d == code) { 
         var ret = s + "{{=arguments.callee("; 
         if(param) 
          ret += param; 
         return ret + ")}}"; 
        } 
       }); 

      }) 
      // HANDLE RECURSION END 

      if (assign === ':') { 
... 
: यहाँ अपने FIDDLE

{{##def.ul:a: 
    <ul> 
    {{~a :value}} 
    <li>{{=value.name}}{{=arguments.callee(value.children)}}</li> 
    {{~}} 
    </ul> 
#}} 

{{#def.ul:it}} 

पुस्तकालय के लेखक (ओं) का एक कांटा निम्नलिखित फैशन में अपने पुस्तकालय में एक ही विचार (untested) को लागू कर सकते हैं