如何在Jade模板引擎中正确输出变量?

时间:2014-04-01 05:34:06

标签: node.js variables pug template-engine

我使用a(href="#{settings.url}")这样的链接,但是有人告诉我,我可以做a(href=settings.url),这是一个更好的解决方案(虽然我不明白其中的区别)。

但现在我对另一个用例有疑问。我应该使用哪一个,如果有的话?为什么?

  1. link(rel="stylesheet", href="#{settings.url}/assets/css/main.css")

  2. link(rel="stylesheet", href=settings.url + "/assets/css/main.css")

1 个答案:

答案 0 :(得分:1)

我想说没有一个非常重要的区别,但让我们来看看幕后:

第一个例子:

link(rel="stylesheet", href="#{locals.url}/assets/css/main.css")

带数据

{ url: 'www.example.com' }

生成此代码

function template(locals) {
    var buf = [];
    var jade_mixins = {};
    buf.push('<link rel="stylesheet"' + jade.attr("href", "" + locals.url + "/assets/css/main.css", true, false) + "/>");
    return buf.join("");
}

和这个HTML

<link rel="stylesheet" href="www.example.com/assets/css/main.css"/>

<强>其次:

link(rel="stylesheet", href=locals.url + "/assets/css/main.css")

将(与上述相同的数据)生成

function template(locals) {
    var buf = [];
    var jade_mixins = {};
    buf.push('<link rel="stylesheet"' + jade.attr("href", locals.url + "/assets/css/main.css", true, false) + "/>");
    return buf.join("");
}

并导致HTML(惊喜!):

<link rel="stylesheet" href="www.example.com/assets/css/main.css"/>

获得的经验教训:
您会发现两种“方法”的差异都很小(请参阅frist示例中的"" +)。 Ergo使用你最喜欢的任何东西。