Échapper à la double accolades {...} dans la Moustache d'un modèle. (templating un modèle en NodeJS)

comme décrit dans cette Question le guidon ne supporte pas de changer les délimiteurs. Mais vous peut échapper à la Double bretelles avec un revers comme celui-ci:

HTML:

... \{{ myHandlbarsVar }} ...

vous pouvez aussi assigner Mustache.tags = ["[[", "]]"]; avant votre compilation de template.

http://jsfiddle.net/fhwe4o8k/1 /

p.ex.

    $(function () {
        Mustache.tags = ["[[", "]]"];
        var template = $('#test').html();
        Mustache.parse(template);
        var rendered = Mustache.render(template, {test: "Chris"});
        $('#content-placeholder').html(rendered);
    });

une autre option est de créer un helper pour outputing accolades.

Handlebars.registerHelper('curly', function(object, open) {
    return open ? '{' : '}';
});

et puis l'utiliser dans le modèle comme ceci:

<script id="template" type="text/x-handlebars-template">
    {{curly true}}{{name}}{{curly}}
</script>

qui sort alors:

{Stack Over Flow Rocks}

je voulais juste une approche légèrement différente. J'ai essayé quelques autres moyens et voici quelques choses que je n'ai pas aimé à leur sujet:

1. changer les crochets angulaires {{obj.property}} en quelque chose d'autre est une mauvaise idée. Principalement parce que dès que vous commencez à utiliser des composants tiers qui ne sont pas au courant de votre configuration angulaire non standard, les fixations dans ces composants tiers cesseront de fonctionner. A noter également que L'équipe D'AngularJS ne semble pas vouloir aller dans la voie d'autoriser les notations de reliure multiples, cochez ce numéro
2. j'aime beaucoup les gabarits de moustache et je ne veux pas changer le projet entier à quelque chose d'autre à cause de ce petit problème.
3. plusieurs personnes recommandent de ne pas mélanger le rendu côté client et Côté Serveur. Je ne suis pas entièrement d'accord, je crois que si vous construisez un site web multipages qui a quelques pages avec angular et certains autres qui sont static (quelque chose comme à propos de nous ou les Termes et conditions des pages) il est parfaitement correct d'utiliser le côté serveur Templier pour rendre la maintenance de ces pages plus facile. Mais cela dit, pour les parties qui sont angulaires, vous ne devriez pas mélanger le rendu côté serveur.

Ok Non ma réponse: Si vous utilisez NodeJS et Express vous devriez être à la suivante:

remplacez les fixations {{}} dans votre partie angulaire par quelque chose comme {[{}]} (ou quelque chose comme completely unique)

maintenant dans votre route ajouter un callback à votre méthode de rendu:

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);
  });
});

cela devrait vous permettre d'utiliser la moustache avec AngularJS. Une amélioration que vous pourriez faire est d'extraire cette méthode dans un module séparé pour la réutiliser sur toutes les routes.

c'est une bonne solution que j'ai trouvé pour ce type de problème où vous pouvez facilement changer les délimiteurs dans les paramètres du modèle dans l'exécution:

http://olado.github.com/doT /

vous pouvez faire les réglages RegEx comme ceci:

doT.templateSettings = {
  evaluate:    /\{\{([\s\S]+?)\}\}/g,
  interpolate: /\{\{=([\s\S]+?)\}\}/g,
  encode:      /\{\{!([\s\S]+?)\}\}/g,
  use:         /\{\{#([\s\S]+?)\}\}/g,
  define:      /\{\{##\s*([\w\.$]+)\s*(\:|=)([\s\S]+?)#\}\}/g,
  conditional: /\{\{\?(\?)?\s*([\s\S]*?)\s*\}\}/g,
  iterate:     /\{\{~\s*(?:\}\}|([\s\S]+?)\s*\:\s*([\w$]+)\s*(?:\:\s*([\w$]+))?\s*\}\})/g,
  varname: 'it',
  strip: true,
  append: true,
  selfcontained: false
};