Search code examples
handlebars.jsassemble

How to include Partials defined in YMF (Assemble.io / Handlebars.js)

I use assemble.io to generate some static files for a simple webpage.

Now i would like to define a list of partials in YAML Front Matter that should be included in the generated page.

I want this 

<div class="slides">
  {{>slide-intro}}
  {{>slide-welcome}}
  {{>slide-goodbye}}
</div>

to be replaced by something like this:

---
slides:
  - slide-intro
  - slide-welcome
  - slide-goodbye
---
<div class="slides">
  {{#each slides}}
    {{>this}}
  {{/each}}
</div>

So, I want to use the variable content stored in this(e.g. slide-welcome) to be used as the name of a partial to be included.

I see that using {{>this}} is not working, but i have no clue where to look for the solution.

Can anybody help me out?

Solution

  • Handlebars 3 introduced Dynamic Partials and you would use them like this:

    ---
slides:
  - slide-intro
  - slide-welcome
  - slide-goodbye
---
<div class="slides">
  {{#each slides}}
    {{> (lookup ../slides @index) }}
  {{/each}}
</div>

    However, assemble 0.4.x is using Handlebars 1, so switch to grunt-assemble, which uses Handlebars 3. grunt-assemble is the same code based, it's just been moved to reflect that it's a grunt plugin.