Escape double braces {{ … }} in Mustache template. (templating a template in NodeJS)

Question

I\'m trying to template a template, like below:

{{{
{
  \"name\" : \"{{name}}\",
  \"description\" : \"{{description}}\"
}
}}}

{{{debug this}}}

Answer 1

I just wanted slightly different approach. I have tried few other other ways and here are few things which I didn't like about them:

1. Changing Angular default {{obj.property}} brackets to something else is a bad idea. Mainly beacause as soon as you start using third party components which are not aware of you non standard angular configuration, bindings in those third part components will stop working. Also worth mentioning that AngularJS team doesn't seem to want to go the route of allowing multiple binding notations, check this issue
2. I quite like Mustache templates and don't want to switch the whole project to something else because of this small issue.
3. Quite a few people recommend not to mix client and server side rendering. I don't fully agree, I believe if you are building a multipage website which has few pages with angular and some other which are static (something like about us or Terms and Conditions pages) it is perfectly fine to use server side templating to make maintaining those pages easier. But that said, for parts which are Angular you shouldn't mixing server side rendering.

Ok no my answer: If you are using NodeJS and Express you should be to the following:

Replace bindings {{}} in your angular part with something like {[{}]} (or something completely unique)

Now in you route add a callback to you render method:

app.get('/', function(req, res){
  res.render('home', {
    title: 'Awesome Website',
    description: 'Uber Awesome Website'
  }, function(err, html){
    var htmlWithReplacedLeftBracket = html.replace(/{\[{/g, '{{');
    var finalHtml = htmlWithReplacedLeftBracket.replace(/}\]}/g, '}}');
    res.send(finalHtml);
  });
});

This should allow you to use Mustache together with AngularJS. One improvement you could do is extract that method into a separate module to reuse across all routes.