仅编译模板的一部分

Question

我有这段代码。

<h1>Title</h1>

<section class="suggestions-section">
    <h2></h2>
    <div class="special-suggestions">
        {{#each suggestions}}
            <fieldset>
                <legend>{{header}}</legend>
                <img src="{{src}}" alt="">
                <div class="placeholder-buy"></div>
            </fieldset>
        {{/each}}
    </div>
</section>

是否可以编译此代码并将h1放在一个DOM元素中，将其他内容放在其他元素中？

const mainContent = $('#main-content');
const header = $('#header');
//compile template
mainContent.prepend(template(data));
header.append(template(data))

我可以使用一个模板执行此操作，还是必须创建两个？

Answer 1

为什么您的标题不属于您的模板？ （我应该期待它也是动态的。）

1. 您可以在单独的文件中使用2个不同的模板。

2. 您可以两次实例化template方法：

   var template = Handlebars.template(src);

   var templateSecond = Handlebars.template(src2);

3. 看一下Partials。有点像自定义过滤器。但是可以做到这一点。

   http://handlebarsjs.com/partials.html