是否可以将我的模板的某些部分放在其他文件中?
我想将我的Jade模板的导航部分放在一个单独的文件( navigation.jade
)中 – 是可以的吗?
我有layout.jade,并想要做这样的事情:
mixin ie(condition, content) | <!--[!{condition}]>!{content}<![endif]--> doctype html html head title= title meta(charset="utf-8") meta(name="viewport" content="width=device-width, initial-scale=1.0") meta(name="description" content="") meta(name="author" content="") link(href="/stylesheets/bootstrap.css" rel="stylesheet") link(href="/stylesheets/style.css" rel="stylesheet") link(href="/stylesheets/responsive.css" rel="stylesheet") link(href="/stylesheets/layout-semiboxed.css" rel="stylesheet") link(href="/stylesheets/skin-red.css" rel="stylesheet") link(rel="shortcut icon" href="img/favicon.ico") +ie('if lt IE 9', '<script src="/javascripts/html5shiv.js"></script>') +ie('if lt IE 9', '<script src="/javascripts/respond.min.js"></script>') +ie('if lte IE 8', '<link href="/stylesheets/ie8.css" rel="stylesheet">') body(class="off") .wrapbox section.toparea .container .row div(class="col-md-6 top-text pull-left animated fadeInLeft") div(class="col-md-6 text-right animated fadeInRight" style="float: right;") .social-icons a(class="icon icon-facebook" href="#") a(class="icon icon-twitter" href="#") a(class="icon icon-linkedin" href="#") a(class="icon icon-skype" href="#") a(class="icon icon-google-plus" href="#") black navigation // <-- this is the part I am trying to add block content
我已经创build了navigation.jade
,它看起来像这样:
extends layout block navigation nav(class="navbar navbar-fixed-top wowmenu" role="navigation") .container .navbar-header a(class="navbar-brand logo-nav" href="index.html") img(src="/images/mightywash.png" alt="logo") ul(id="nav" class="nav navbar-nav pull-right") li(class="active") a(href="/") Home li a(href="/locations") Locations li a(href="/charity") Charity li a(href="/washpackages") Wash Packages li a(href="/lubecenters") Oil Change / Lube Centers li a(href="/contact") Contact
我怎么把这两个放在一起?
是的,玉有一个包含指令。
如果您的导航栏位于很多页面中,请将其放入(或包含)到您扩展的布局中。 所以人人都懂 其他只是包括在几页。
语法是(例如,我把一个页脚放在每一页的底部
include ../public/footer1.html
我怀疑“绝对path”,例如/public/foo.html
也适用 – 尝试它(我也是一个新手)。 你可以包括.jade而不是.html更多的Jade示例在这里:( http://jade-lang.com/reference/#includes )这里是我的完整模板(呃,我的意思是布局)把标题导航栏和页脚每一页。 因人而异:
doctype 5 html head title= title link(rel='stylesheet', href='/stylesheets/nextq1.css') block head body include ../public/header1.html block content include ../public/footer1.html
包括有时可能需要包含标签也..例如:
include includes/footer.jade
footer.jade是与当前的jade文件相同的文件夹…你不能在脚本部分包含“include”
你的代码看起来很好..应该工作! 除非是在使用black navigation
而不是block navigation
。
万一不行,你可以试试这个方法..
最简单的方法是使用include
。
你有文件navigation.jade
。要包含这个文件,就好像它是layout.jade
的一部分,只需添加
include ./navigation.jade
并删除block navigation
线。
如果使用此方法,则从navigation.jade
文件的顶部删除extends layout
线。