<script id="node" type="text/x-handlebars-template">
<div>常规的partial代码片段</div>
{{> dynamicPartial}}
<div>动态的代码片段</div>
{{> (whichPartial) }}
<div>动态的带参数的函数代码片段</div>
{{> (paramsPartial 'partial2')}}
</script>
<div id="container"></div>
// 通过注册函数代码块助手的方式
Handlebars.registerHelper('whichPartial', function(context, options){
return 'dynamicPartial';
});
Handlebars.registerHelper('paramsPartial', function(params){
return params;
});
Handlebars.registerPartial('partial1', '<span>我是片段一</span>');
Handlebars.registerPartial('partial2', '<span>我是片段二</span>');
Handlebars.registerPartial('dynamicPartial', '{{name}}');
var source = $("#node").html();
var template = Handlebars.compile(source);
var context = { name: "Koby" };
var html = template(context);
$('#container').html(html);
This Pen doesn't use any external CSS resources.