CODEWITHSUNDEEP
javascriptjqueryhandlebars.js
Симеон Симеонов
Симеон Симеонов

Reputation: 171

Compile only part of template

I have this piece of code. 

<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>

Is it possible to compile this code and put h1 in one DOM element and other things in other?

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

Can I do this using one template or I have to make two?

Upvotes: 0

Views: 23

Answers (1)

Paul Melero
Paul Melero

Reputation: 1395

Why is your title not part of your template? (I should expect it to be dynamic as well.)

  1. You can use 2 different templates in separate files as you say.

  2. You can instantiate template method twice:

    var template = Handlebars.template(src);

    var templateSecond = Handlebars.template(src2);

  3. Take a look at Partials. kinda like custom filters. But can do the job.

    http://handlebarsjs.com/partials.html

Upvotes: 1

Related Questions