[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(...)