I have an app in Node.js using Expressjs and Handlebars as the template engine.
Expressjs uses layouts and then renders views. The layout (layout.hbs) looks like this:
<!doctype html>
<html lang="en">
<head>
</head>
<body>
{{{body}}}
</body>
</html>
The {{{body}}} is replaced server-side, within node.js when you access a route. For example:
app.get('/', function(req, res){
res.render('index'})
})
Will replace the {{{body}}} tag with the contents of index.hbs.
Now, on the client side I'm using Backbone.js and want to use Handlebars for the views controlled via Backbone. The problem is that because these pages are already rendered through Handlebars, when I attempt to use Handlebars within it (or Handlebars within Handlebars) it doesn't work. There are no errors, it simply just doesn't replace tags with data.
Has anyone encountered this before or have any idea a work around?
Thank you!
Yup, it's a sticky problem --- kind of like the quoting problems in shell scripts which become a rats' nest of quoted quotes.
My solution is to use jade (a la haml) in expressjs (server-side) to output handlebars based templates for the client. This way, the server uses one syntax (jade), and the client uses another (handlebars). I am at the same crossroads as you, so I have the same challenge.
Of course, jade is not essential (though it's ready-made for expressjs). You could choose any (non-handlebars) template engine for the server, and/or you could use handlebars on the server with your non-handlebars templating on the client --- as long as the two syntaxes of your chosen templating engines do not collide. Since I'm using emberjs on the client and it uses handlebars syntax (by default), I prefer using emberjs + handlebars syntax on the client. So expressjs + jade became a natural fit for the server.