temple.js templating example

temple-template.html

<h1 data-templ="header"></h1>
<ul data-templ="items">
    <li>
        <strong data-templ="strong name"></strong>
        <a href="#" data-templ="url name"></a>
    </li>
</ul>
<p data-templ="empty">The list is empty.</p>

temple-templating.js

{
    header: "Colors",
    items: [
        {name: "red", url: null},
        {name: "green", strong: null,
            url: {attr: "href", value: "#Green"},
        },
        {name: "blue", strong: null,
            url: {attr: "href", value: "#Blue"}
        }
    ],
    empty: null
}