Escape двойные скобки { ... } в шаблоне усов. (создание шаблона в NodeJS)
Я пытаюсь создать шаблон шаблона, как показано ниже:
{{{
{
"name" : "{{name}}",
"description" : "{{description}}"
}
}}}
{{{debug this}}}
<h1>{{name}}</h1>
где я хочу утроить скобки, чтобы остаться, но двойные скобки должны быть заменены на JSON. Кто-нибудь знает лучший способ сделать это без написания кода JS после процесса, и если нет, есть ли хороший механизм шаблонов nodeJS для этого типа сценария?
6 ответов
вы можете переключить разделители на что-то, что не будет конфликтовать с тройными усами, например теги в стиле erb:
{{=<% %>=}}
{{{
{
"name": "<% name %>",
"description": "<% description %>"
}
}}}
{{{debug this}}}
<%={{ }}=%>
обратите внимание, что вы можете сделать это столько раз, сколько вам нравится в течение вашего шаблона. Каждый раз, когда вы сталкиваетесь с чем-то, что конфликтует, выберите новый набор разделителей :)
как описано в этот вопрос руль не поддерживает изменение разделителей. Но ты! .. --4-->can escape двойные скобки с обратной косой чертой, как это:
HTML-код:
... \{{ myHandlbarsVar }} ...
вы также можете назначить Mustache.tags = ["[[", "]]"];
перед компиляцией шаблона.
http://jsfiddle.net/fhwe4o8k/1/
например
$(function () {
Mustache.tags = ["[[", "]]"];
var template = $('#test').html();
Mustache.parse(template);
var rendered = Mustache.render(template, {test: "Chris"});
$('#content-placeholder').html(rendered);
});
другой вариант-создать помощник для вывода фигурных скобок.
Handlebars.registerHelper('curly', function(object, open) {
return open ? '{' : '}';
});
а затем используйте его в шаблоне следующим образом:
<script id="template" type="text/x-handlebars-template">
{{curly true}}{{name}}{{curly}}
</script>
, который затем выводит:
{Stack Over Flow Rocks}
Я просто хотел немного другой подход. Я пробовал несколько других способов, и вот несколько вещей, которые мне в них не понравились:
- изменение углового значения по умолчанию
{{obj.property}}
скобки к чему-то еще-плохая идея. В основном потому, что как только вы начнете использовать сторонние компоненты, которые не знают о нестандартной угловой конфигурации, привязки в этих компонентах третьей части перестанут работать. Также стоит отметить, что команда AngularJS, похоже, не хочет пройдите маршрут разрешения нескольких Привязок, проверьте этот вопрос - мне очень нравятся шаблоны усов и не хочу переключать весь проект на что-то еще из-за этой небольшой проблемы.
- довольно много людей рекомендуют не смешивать рендеринг на стороне клиента и сервера. Я не полностью согласен, я считаю, что если вы создаете многостраничный веб-сайт, который имеет несколько страниц с angular и некоторыми другими, которые статичны (что-то вроде нас или терминов и Страницы условий) вполне нормально использовать шаблоны на стороне сервера, чтобы упростить обслуживание этих страниц. Но, тем не менее, для деталей, которые являются угловыми, вы не должны смешивать рендеринг на стороне сервера.
Ok нет моего ответа: Если вы используете NodeJS и Express, вы должны быть следующим:
заменить переплеты {{}}
в вашей угловой части с чем-то вроде {[{}]}
(или что-то совершенно уникальное)
теперь в вашем маршруте добавьте обратный вызов для рендеринга метод:
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);
});
});
это должно позволить вам использовать усы вместе с AngularJS. Одним из улучшений, которые вы можете сделать, является извлечение этого метода в отдельный модуль для повторного использования по всем маршрутам.
Это хорошее решение, которое я нашел для этого типа проблемы, где вы можете легко переключать разделители в настройках шаблона во время выполнения:
вы можете сделать настройки RegEx следующим образом:
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
};