Böyle bir veri yapısına sahip varsayarsak:Özyineleme doT.js ile
{ 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: []
}
]
}
]
}
ben yinelemeli nesne geçmesi ve iç içe listeleri inşa edecek doT.js içeren bir şablon oluşturma hakkında nasıl gitmek? Bir özyinelemeli fonksiyonu ile JS doğrudan html dize Bina
yalındır yeterlidir:
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);
Ama doT.js ile (http://jsfiddle.net/fergal_doyle/WN8hZ/5/)
DÜZENLEME: partials kullanarak bunu başarmak için çalışıyordu
{{ function buildList(a) { }}
{{?a.length}}
<ul>
{{~a :v}}
<li>
{{=v.name}}
{{ buildList(v.children); }}
</li>
{{~}}
</ul>
{{?}}
{{ } }}
{{ buildList(it.list); }}
Ben değerlendirmede (http://jsfiddle.net/fergal_doyle/he8AN/) ile bazı JS karıştırarak yapabilirsiniz. Bir ul snippet'i tanımlamak, o snippet'in kendisini bir dizide param olarak geçirmesini gerektiriyor, ancak "çok fazla özyineleme" hatası alıyorum. Aşağıda çalışmak için herhangi bir yolu varsa, bence yukarıda bence çok daha temiz. (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}}