Jade template engine, как использовать layout.jade?

У меня есть веб-сайт в node.js; для создания страницы, скажем mypage Я заметил, что мне нужно создать файлы layout.jade и mypage.jade. Если я помещаю код в mypage.jade, он не отображается, поэтому сначала я должен заполнить layout.jade макетом страницы.

Мой вопрос: как мне ссылаться внутри layout.jade на то, что я хотел бы загрузить содержимое mypage.jade в определенном контейнере, например? Могу ли я иметь разные страницы с одинаковой компоновкой? Как я могу это сделать?

Спасибо

Ответы

Ответ 1

http://expressjs.com/guide.html#view-rendering

Если вы не хотите использовать макеты, вы можете отключить их по всему миру:

app.set('view options', {
  layout: false
});

Если вы не делаете, что макеты включены по умолчанию, а Express выполняет поиск стандартного макета в папке your_view_folder/layout.jade

Вы можете указать отдельный макет для каждого маршрута:

res.render('page', { layout: 'mylayout.jade' }); 
// you can omit .jade if you set the view engine to jade

Вот как выглядит ваш файл макета:

doctype html
html(lang="en")
  head
    title Testing 123
  body
    div!= body

Обратите внимание, что тело будет взято из "mypage.jade".

Изменить:

Вот реальный пример в приложении:

Файл приложения (содержащий маршруты и конфиги):
https://github.com/alexyoung/nodepad/blob/master/app.js

Файл макета:
https://github.com/alexyoung/nodepad/blob/master/views/layout.jade

Ответ 2

Немного поздно вечеринке, но я изо всех сил пытался найти ответ сначала... В layout.jade

doctype html
html(lang="en")
    head
    body
        h1 Hello World
        block myblock

Затем в index.jade

extends layout
    block myblock
        p Jade is cool

Выведет

<!DOCTYPE html>
<html lang="en">
<head>
<body>
    <h1>Hello World</h1>
    <p>Jade is cool</p>
</body>
</html>

Ответ 4

Я знаю подход, который дал мне лучшие результаты, даже с angular (для замены angular -route/ng-view)

Прежде всего, необходимо установить экспресс-макет:

npm install --save express-layout

После этого экспресс будет искать файл layout.jade внутри вашей папки views/. Итак, внутри этого вы можете использовать:

вид /layout.jade

html
  head
    meta(charset='utf-8')
    title= title
  body
    div!= body

вид /home.jade

h1 Welcome aboard, matey!

server.js

var express = require('express'),
    layout = require('express-layout');

var app = express();

app.get('/', function(req, res) {
    res.render('home', {
    title: 'Welcome!'
});

По умолчанию express будет искать layout.jade в вашей папке views/, но вы можете изменить значение по умолчанию, используя (да, нет необходимости писать расширение .jade):

app.set('layout', 'default');

После этого экспресс будет использовать представления /default.jade в качестве макета по умолчанию.

Также, если вы хотите использовать другой макет на определенной странице, вы можете использовать:

app.get('/', function(req, res) {
    res.render('home', {
    layout: 'login',
    title: 'Welcome!'
});

Здесь express отобразит login.jade как макет.

Я предполагаю, что вы используете Jade как механизм представления по умолчанию и не меняете папку по умолчанию для представлений.

Вот экспресс-макет doc.