var eachData = { users: [{ name: 'jerry' }, { name: 'john'}], groups: [{ name: 'mingdao' }, { name: 'meihua' }, { name: 'test'}], departs: [{ name: 'IT'}] };
$("#each").tmpl(eachData).appendTo('#div_each');
{{if }} {{else}}提供了分支逻辑 {{else}} 相当于else if
${ID}{{= Name}}
{{if Status}}
Status${Status}
{{else App}}
App${App}
{{else}}
None
{{/if}}
var users = [{ ID: 'think8848', Name: 'Joseph Chan', Status: 1, App: 0 }, { ID: 'aCloud', Name: 'Mary Cheung', App: 1 }, { ID: 'bMingdao', Name: 'Jerry Jin'}];
$("#ifelse").tmpl(users).appendTo('#div_ifelse');
{{html}} 输出变量html,但是没有html编码，适合输出html代码
${ID}
{{= Name}}
${html}
{{html html}}
var user = { ID: 'think8848', Name: 'Joseph Chan', html: '' };
$("#html").tmpl(user).appendTo('#div_html');
{{tmpl}} 嵌套模版
${ID}
{{tmpl($data) '#tmpl2'}}
{{each Name}}${$value} {{/each}}
var users = [{ ID: 'think8848', Name: ['Joseph', 'Chan'] }, { ID: 'aCloud', Name: ['Mary', 'Cheung']}];
$("#tmpl1").tmpl(users).appendTo('#tmpl');
{{wrap}},包装器
The following wraps and reorders some HTML content:
{{wrap "#tableWrapper"}}
One
First content
Two
And more content...
{{/wrap}}
{{each $item.html("h4", true)}}
|
${$value}
|
{{/each}}
{{each $item.html("div")}}
|
{{html $value}}
|
{{/each}}
$(function () {
$('#myTmpl').tmpl().appendTo('#wrapDemo');
});
$data $item $item代表当前的模板；$data代表当前的数据。
${$data.ID}
${$item.getName(" ")}
var users = [{ ID: 'think8848', Name: ['Joseph', 'Chan'] }, { ID: 'aCloud', Name: ['Mary', 'Cheung']}];
$("#item_data").tmpl(users,
{
getName: function (spr) {
return this.data.Name.join(spr);
}
}).appendTo('#div_item_data');
$.tmplItem()方法，使用这个方法，可以获取从render出来的元素上重新获取$item
另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。
网站名称：jquery.tmpl.min.js--前端实现模版--数据绑定-创新互联
转载源于：http://bzwzjz.com/article/diecje.html
