Преобразование древовидной структуры с помощью Tempo
Я начал использовать структуры данных JSON вместо XML в небольшом веб-проекте. Мне нужно сделать некоторые преобразования данных, как вы обычно делаете с XSLT на XML, а затем я наткнулся на классную библиотеку http://tempojs.com/.
Но настоящая проблема появилась, когда я понял, что мои данные - это древовидная структура, и я думаю, что необходима некоторая рекурсия в преобразовании.
Вот пример структуры данных:
[
{
"text" : "The sun is shining",
"children" : []
},
{
"text" : "it's cloudy.",
"children" :
[
{
"text" : "It's raining.",
"children" : []
},
{
"text" : "The sun was shining.",
"children" : []
},
{
"text" : "A rainbow appeared.",
"children" :
[
{
"text" : "A pot of gold was found at the end of the rainbow.",
"children" : []
},
{
"text" : "The gold returned more than a million dollars, when sold.",
"children" : []
}
]
}
]
}
]
И что я хотел бы преобразовать во вложенный список HTML, как это:
<ul>
<li>The sun is shining</li>
<li>it's cloudy.
<ul>
<li>It's raining.</li>
<li>The sun was shining.</li>
<li>A rainbow appeared.
<ul>
<li>A pot of gold was found at the end of the rainbow.</li>
<li>The gold returned more than a million dollars, when sold.</li>
</ul>
</li>
</ul>
</li>
</ul>
Есть идеи, как это можно сделать с помощью Tempo?
2 ответа
Tempo 1.x не может обрабатывать несколько уровней вложенных шаблонов. Однако ветка 2.0-dev поддерживает это и, как мне кажется, правильно отображает ваши данные: http://jsfiddle.net/mr_olafsson/wLEQs/
Обратите внимание, что пример подразумевает фиксированное (и равное) количество уровней / вложенных шаблонов. Дайте мне знать, как вы поживаете! Извините за задержку с ответом.
Я не знаю темп, вместо этого я использую underscore.js.
это будет что-то вроде этого:
var mytemplate = "
<%= text %>
<ul>
<% _.each(children, function(child){ %>
<li><%= child.text %></li>
<li><%= _.template(mytemplate, child.children) %>
</li>
</ul>
";
var htmlResult = _.template(mytemplate, myJSON);