You can see the complied HTML in Result panel real time by editing the codes in Data and Template panel.
{
code : 1,
data: [{
id : 1,
name : "Sky",
gender : "male"
}, {
id : 2,
name : "Kathy",
gender : "female"
}]
}
<h2>Name List</h2>
<article>
@if(code === 1) {
<ul>
@{
data.forEach(function(person) {
<li class="@(person.gender === 'female' ? 'pink' : '')">
<a href="/details/@person.id">@person.name</a>
</li>
});
}
</ul>
} else {
<p>Sorry, no data!</p>
}
</article>