JavaScript-Templates

https://github.com/blueimp/JavaScript-Templates

https://blueimp.github.io/JavaScript-Templates/

https://github.com/blueimp/JavaScript-Templates/blob/master/README.md

template

<h3>{%=o.title%}</h3>
<p>Released under the
<a href="{%=o.license.url%}">{%=o.license.name%}</a>.</p>
<h4>Features</h4>
<ul>
{% for (var i=0; i<o.features.length; i++) { %}
    <li>{%=o.features[i]%}</li>
{% } %}
</ul>

data

{
"title": "JavaScript Templates",
"license": {
"name": "MIT license",
"url": "https://opensource.org/licenses/MIT"
},
"features": [
"lightweight & fast",
"powerful",
"zero dependencies"
]
}

 

显示

Render the result by calling the tmpl() method with the id of the template and the data object as arguments:

document.getElementById("result").innerHTML = tmpl("tmpl-demo", data);

 

 

 

Templates syntax

Interpolation

Print variable with HTML special characters escaped:

<h3>{%=o.title%}</h3>

Print variable without escaping:

<h3>{%#o.user_id%}</h3>

Print output of function calls:

<a href="{%=encodeURI(o.url)%}">Website</a>

Use dot notation to print nested properties:

<strong>{%=o.author.name%}</strong>

 

Evaluation

Use print(str) to add escaped content to the output:

<span>Year: {% var d=new Date(); print(d.getFullYear()); %}</span>

Use print(str, true) to add unescaped content to the output:

<span>{% print("Fast &amp; powerful", true); %}</span>

Use include(str, obj) to include content from a different template:

<div>
{% include('tmpl-link', {name: "Website", url: "https://example.org"}); %}
</div>

If else condition:

{% if (o.author.url) { %}
    <a href="{%=encodeURI(o.author.url)%}">{%=o.author.name%}</a>
{% } else { %}
    <em>No author url.</em>
{% } %}

For loop:

<ul>
{% for (var i=0; i<o.features.length; i++) { %}
    <li>{%=o.features[i]%}</li>
{% } %}
</ul>

 

文件结构分析

有3个Function in Dart，分别是load，func,encode

另外有6个字段

 

作者:Chuck Lu    GitHub