[JS Render] JS Render 模板语法

1.
{{:key}}
获取值

~root:   顶级对象
#item:   当前对象
#index:  当前索引

2.
{{>untrustedValue}}
获取HTML编码后的值

3.
{{include tmpl=... /}}
引用模板

4.
{{for ...}}
数组遍历

5
{{props billing.address}}
{{>key}}: {{>prop}}
{{/props}}
对象遍历

6
{{if firstExpression}}
render this if the firstExpression is true
{{else secondExpression}}
else render this if the secondExpression is true
{{else}}
else render this
{{/if}}

{{for members}}
Member Name: {{:name}}
{{else}}
There are currently no members...
{{/for}}


{{tabs tabCaption="First Tab"}}
first tab content
{{else tabCaption="Second Tab"}}
second tab content
{{/tabs}}

条件分支

7.
{{*: ...}}
执行JS代码,当$.views.settings.allowCode(true);时.

{{*: ...}}
执行JS代码并输出结果,当$.views.settings.allowCode(true);时.

8.
{{!-- ... --}}
注释

9.
自定义标签
function renderBoldP(value) {
return "<p><b>" + value + "</b></p>";
}

$.views.tags("boldp", renderBoldP);

10.

访问上下文

~root

11.
自定义转换器
$.views.converters("upper", function(val) {
// Convert data-value or expression to upper case
return val.toUpperCase();
});

{{upper:...}}

12.
{{:address.street onError="Address unavailable"}}
异常处理

13.
全局工具类
var myHelpers = {format: myFormatFunction};

$.views.helpers(myHelpers);
{{:~format(name, true)}}

模板级工具类
var myHelpers = {format: myFormatFunction};


$.templates({
mytmpl: {
markup: "#personTemplate",
helpers: myHelpers
}
});
{{:~format(name)}}
{{:~format(name, true)}}

$.views.helpers(...)
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值