Jade模块如何工作 - Jade

我正在尝试使用Jade模块，并且我的内容未显示。这里是我的index.jade：Jade模块如何工作 - Jade

//index.jade 
extends ../includes/layout 

block main-content 
    section.content 
    div(ng-view)

它添加layout文件中像我期望的那样。下面是该文件：

//layout.jade 
doctype html 
html 
    head 
    link(href="/favicon.ico", rel="shortcut icon",type="image/x-icon") 
    link(rel="stylesheet", href="/css/bootstrap.css") 
    link(rel="stylesheet", href="/vendor/toastr/toastr.css") 
    link(rel="stylesheet", href="/css/site.css") 
    body(ng-app="app") 
    h1 Hello Worldd 
    include scripts

但它不包括我main.jade：

// main.jade 
h1 This is a Partial 
h2 {{ myVar }}

或之后的任何代码。这是我第一次使用Jade，所以我很挣扎。另外，当您包括block时，-content是什么？谢谢。

来源

2014-02-05 jhamm

块是您要插入到要扩展的模板的内容的“块”。

假设目录布局：

|--views 
    |--layout.jade 
    |--index.jade 
    |--main.jade

下面是使用你的模板的例子：

//layout.jade

doctype html 
html 
    head 
    link(href="/favicon.ico", rel="shortcut icon",type="image/x-icon") 
    link(rel="stylesheet", href="/css/bootstrap.css") 
    link(rel="stylesheet", href="/vendor/toastr/toastr.css") 
    link(rel="stylesheet", href="/css/site.css") 
    body(ng-app="app") 
    h1 Hello Worldd 
    block content 
    include scripts

然后从layout.jade延长所有其他页面也将内容插入该区块：

//index.jade

extends layout 
block main-content 
    section.content 
    div(ng-view)

//main.jade

extends layout 
block content 
    h1 This is a Partial 
    h2 {{ myVar }} // which should be: h2= myVar

这会使（使用快递假设）：

//index.html

doctype html 
html 
    head 
    link(href="/favicon.ico", rel="shortcut icon",type="image/x-icon") 
    link(rel="stylesheet", href="/css/bootstrap.css") 
    link(rel="stylesheet", href="/vendor/toastr/toastr.css") 
    link(rel="stylesheet", href="/css/site.css") 
    body(ng-app="app") 
    h1 Hello Worldd 
    section.content 
     div(ng-view) 
    include scripts

//main.html

doctype html 
html 
    head 
    link(href="/favicon.ico", rel="shortcut icon",type="image/x-icon") 
    link(rel="stylesheet", href="/css/bootstrap.css") 
    link(rel="stylesheet", href="/vendor/toastr/toastr.css") 
    link(rel="stylesheet", href="/css/site.css") 
    body(ng-app="app") 
    h1 Hello Worldd 
    h1 This is a Partial 
    h2 {{ myVar }} // which should be: h2= myVar 
    include scripts

来源

2014-04-02 07:35:59 Tony

Jade模块如何工作 - Jade

回答

相关问题