ericf / express-handlebars

A Handlebars view engine for Express which doesn't suck.
BSD 3-Clause "New" or "Revised" License
2.31k stars 384 forks source link

Add an example in the docs to have multiple views on a single layout. #26

Closed ghost closed 10 years ago

ericf commented 11 years ago

I'm not sure what you mean, could you provide more info?

Express' res.render() method accepts a single view string name. What are you trying to accomplish, and would using partials work?

owzzz commented 11 years ago

In the docs you mention how you can select a layout. e.g "main" and then you use a {{{body}}} place holder to pull in a view. but what if in my main layout I wanted three columns and in each column a view place holder for each.

So I'd create three views in my layouts>views folder and then in my layout I'd add the place holders where I want those views to be rendered.

How would I go about doing this?

ericf commented 11 years ago

You can use partials for this, and if you want to make this dynamic, check out issue #15 as it's related. Using the helpers I described in that issue you could do something like this:

layouts/main.handlebars:

...
<div class="sidebar-left">
    {{{block "sidebar-left"}}}
</div>
...

partials/settings-nav.handlebars:

<ul class="nav">
    <li><a href="/settings/email/">Change Email</a></li>
</ul>

settings.handlebars:

...
{{#contentFor "sidebar-left"}}
    {{> settings-nav}}
{{/contentFor}}
...

This way you can create arbitrary placeholders in your layout template, and fill in those placeholders inside your views—and do so by using partials.

ghost commented 11 years ago

Why do I need the settings.handlebars in this case?

Can I not have:

layouts/main.handlebars

<div class="wrapper">
    <section class="main-content">
        {{{block "main"}}}
    </section>
     <aside class="sidebar">
        {{{block "side"}}}
    </aside>
</div>

layouts/partials/main.handlebars

<h1> A Title </h1>
<p>Some Content Goes Here</p>

layouts/partials/side.handlebars

<nav>
    <ul>
        <li>A List item 1</li>
        <li>A List item 1</li>
        <li>A List item 1</li>
    </ul>
</nav>
ericf commented 10 years ago

I don't remember what the action item is for this, so closing it…