Question

使用Jade模板引擎，我希望能够在扩展另一个模板的模板中有选择地将类声明为body标签。

layout.jade

!!! 5
html(lang='en')
head
    block title
    meta(charset='utf-8')
    link(rel='stylesheet', href='/stylesheets/style.css')
    block addhead

block body
    div#wrap
        header
            div#header_content
                p
                    a(href='/')
                        img(src='/images/logo.png', alt='Template-e-o')
            div.hr.red
        br(style='clear:both;')

        div#content
            block content
            br(style='clear:both;')

index.jade

extends layout

block title
    title bidi

block body
    body.index

block content
    p ’ello govna.

这不起作用。

Answer 1

Jade支持像字符串解释一样的红宝石

在您的布局中

- var bodyClass = '';
block vars
body(class='#{bodyClass}')
  block content

在您的视图文件

中

extends layout
block vars
  - var bodyClass = 'my-page';
block content
  p Hello World!

Answer 2

您可以在父作用域中操作变量，因此也可以使用此解决方案：

在您的布局中

- var bodyClasses = [];
block beforeBody

body(class=bodyClasses)
  block content

在您的视图文件

中

extends layout
block beforeBody
  - bodyClasses.push('my-page')
block content
  p Hello World!

这样做可以在布局的不同级别添加多个类。

Answer 3

好的，block body语句只是一个名称正文的块，所以在你的布局中你没有包含body标签，它必须添加到index.jade（你的试着做）。但是，在你的index.jade中，你只用body.index 替换块内容（我想 - 因为我不在我的开发计算机上，现在不能试试 - 渲染OK但是取出整个内容，你最终只有一个空体，尽管它应该有class ='index'属性。）

你可以尝试的是（在index.jade中）：

block prepend body
    body.index

但是我不确定你的layout.jade（div＃wrap）的其余部分是否会在body下正确呈现（我怀疑它）。

我建议，如果它只是在主体上添加条件类的问题，就像在layout.jade中那样（而不是块体）：

body(class=myClassLocalVar)

在.render调用（res.render('index', {myClassLocalVar: 'theClass'});）中指定了myClassLocalVar。 myClassLocalVar甚至可以是一个数组，jade会将数组中的所有类分配给你的身体。

使用Jade，如何在扩展模板中声明一个body类？

3 个答案:

在您的布局中

在您的视图文件

在您的布局中

在您的视图文件