Блог

Главная - Вопросы по программированию - Express

Express

#javascript #node.js #express #pug

#javascript #node.js #экспресс #pug

Вопрос:

Я играю с экспресс-сайтом с Node.JS

У меня есть файл макета, который, скажем, выглядит так:

 html
    title foo
body!= body

Из того, что я смог понять, выходные данные шаблона вставляются в вызываемую переменную body , которая добавляется к макету в 3-й строке. Однако, если бы я хотел, чтобы шаблон добавлял, например, <meta> тег в <head> элемент, как бы я это сделал?

Я видел объяснение расширения шаблонов и использования блоков, но я не уверен, как это связано с использованием макетов. Сами шаблоны не должны расширять макет, верно? Или наследование шаблонов вообще устраняет необходимость в макетах? Я бы подозревал, что нет, но я не уверен.

Кроме того, поскольку я здесь, как вы указываете другой макет для использования или для того, чтобы макет вообще не использовался. В настоящее время представления отображаются следующим образом:

 res.render('templateName', { myTemplateVars : 'foo' });

Ответ №1:

То, о чем вы просите, было выпущено 3 дня назад.

http://tjholowaychuk.com/post/10695801204/jade-stylus-0-16-0-released

Я лично использую его уже несколько недель, и мне нравятся недавние дополнения. Оператор block позволяет указать содержимое по умолчанию, и любой шаблон расширения может переопределить именованный блок.

По сути, блоки переопределяют, включают, добавляют и расширяют выбор вашего родительского шаблона.

Комментарии:

1. хорошо, значит, в моем случае в макете должно быть block meta , а затем внутри ничего не должно быть, и тогда шаблон может писать block meta и добавлять любые теги, какие захочет?

2. Да, операторы блоков могут быть объявлены без вложенного содержимого, выступая в качестве держателя места содержимого. Наследующие шаблоны также могут объявлять блоки без содержимого, но просто следите за тем, чтобы родительские блоки не были заблокированы.

3. Grr … неправильная клавиша ввода 🙂 Итак, добавьте мета-блок и в ваших наследуемых шаблонах определите мета-блок и добавьте любые теги, которые вы хотите в блоке для этого шаблона. Кроме того, удалите переменную body и сделайте ее блоком для переопределения в ваших дочерних шаблонах. Надеюсь, это поможет.

Ответ №2:

Попробуйте движок шаблонов dust.
Это гораздо интереснее и удобнее для дизайнера.
В dust вы можете написать base.html:

 <html>
<head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <title>kiss.js example</title>
    <link rel="stylesheet" href="/css/css1.css" />
    <link rel="stylesheet" href="/css/css2.css" />
    <script type="text/javascript" src="/js/js1.js"></script>
    <script type="text/javascript" src="/js/js2.js"></script>
    { head/}
</head>
<body>
    <div style="height: 100%">
        <div id="header">
            <h1>kiss.js example - { header}{/header}</h1>
            { header_buttons}{/header_buttons}
        </div>
        <div id="content">
            { content}{/content}
        </div>
        <div id="footer">
            <table>
                <tr>
                    <td>
                        amp;nbsp;amp;nbsp;
                    </td>
                    <td style="width: 100%; text-align: center;">made with kiss.js</td>
                    <td>{ footer_buttons}{/footer_buttons}</td>
                </tr>
            </table>
        </div>
    </div>
</body>

и view.html: 



 {>base.html/}
{<content}
    <h2>name: {name}</h2>
    <h3>{foo}</h3>
    {#numbers}
        <div>{.}</div>
    {/numbers}
{/content}

Комментарии:

1. Можете ли вы вставить, как вы настраиваете app.js использовать шаблоны для пыли?