首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >embedding Jade包含变体

embedding Jade包含变体
EN

Stack Overflow用户
提问于 2016-01-31 23:16:13
回答 1查看 253关注 0票数 3

为了方便地创建通用UI组件的参考目录,我想从一系列标记片段(每个组件一个)生成一个静态页面:

代码语言:javascript
复制
h2 List Group
p as provided by Bootstrap
+component("list_group")

h2 Panel
p also provided by Bootstrap
+component("panel")

这应该包括三个版本的Jade文件:原始的,转义的HTML和未转义的HTML。

代码语言:javascript
复制
h3 Markup (HTML)
pre.lang-html
    include:escaped components/list_group

h3 Markup (Jade)
pre.lang-jade
    include:verbatim components/list_group

h3 Output
include components/list_group
代码语言:javascript
复制
<h3>Markup (HTML)</h3>
<pre class="lang-html">
    &lt;ul class="list-group"&gt;
        &lt;li class="list-group-item"&gt;foo&lt;/li&gt;
        &lt;li class="list-group-item"&gt;bar&lt;/li&gt;
    &lt;/ul&gt;
</pre>

<h3>Markup (Jade)</h3>
<pre class="lang-jade">
    ul.list-group
        li.list-group-item foo
        li.list-group-item bar
</pre>

<h3>Output</h3>
<ul class="list-group">
    <li class="list-group-item">foo</li>
    <li class="list-group-item">bar</li>
</ul>

然而,据我所知,Jade不支持动态/参数化的包含*,所以它并不像预期的那样简单。

我可以(Ab)使用自定义过滤器来代替吗?(看起来我无论如何都要编写escaped过滤器。)任何建议都将不胜感激。

*虽然有some hints v2.0实际上支持这一点,但我不知道如何

EN

回答 1

Stack Overflow用户

发布于 2016-02-18 15:52:58

您可以使用类似于

main.jade

代码语言:javascript
复制
- var condition=false
if condition
  include ./sub.jade
else
  include ./sub2.jade

sub.jade

代码语言:javascript
复制
p Hello World

sub2.jade

代码语言:javascript
复制
p 42

使用condition=true

代码语言:javascript
复制
kluth@pc:~/$ jade main.jade && cat main.html
rendered main.html
<p>Hello World</p>

使用condition=false

代码语言:javascript
复制
kluth@pc:~/$ jade main.jade && cat main.html
rendered main.html
<p>42</p>

使用jade 1.11.0进行测试

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/35115435

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档