如何将变量从 Jade 模板文件传递到 Javascript 文件？答案

【问题标题】：How do I pass variable from a Jade template file to a Javascript file?如何将变量从 Jade 模板文件传递到 Javascript 文件？
【发布时间】：2014-02-09 22:10:43
【问题描述】：

我对 Node.js 非常陌生，并试图了解一些事情。如何将变量从 Jade 模板文件传递到 JS 文件？

我的 server.js 文件中有这行代码

res.render("aws.jade", {data : JSON.stringify({'val' : 'This is a Test'})});

基本上我只是想将 data 中的值获取到 aws.jade 模板文件

这是 aws.jade

html
    head
       script(type='text/javascript')
            var data = !{data}
        link(rel='stylesheet', href='/stylesheets/style.css')
    body
        title Title
        h1 Heading
        #div.test

我在 Firebug 控制台中不断收到此错误：

<var>data = {"val":"This is a Test"}</var>

有人可以解释一下为什么会发生这种情况以及我将变量从 Jade 模板文件传递到 JS 文件的方法吗？

谢谢

【问题讨论】：

标签： node.js express pug

【解决方案1】：

尝试在脚本后添加. 字符，这告诉 Jade 您想要标签内的文本块。

这是您更新后的代码。

html
    head
        script(type='text/javascript').
            var data = !{data}
        link(rel='stylesheet', href='/stylesheets/style.css')
    body
        title Title
        h1 Heading
        #div.test

EDIT - 将标题设置为 data.val

首先你应该改变你的响应，移除 JSON.stringify 以便你返回一个对象而不是一个字符串值。

res.render("aws.jade", {data : {'val' : 'This is a Test'}});

那么您应该能够直接使用点符号访问数据对象的属性和结构，并将其直接分配给这样的标题元素...

title= data.val

【讨论】：

感谢您的回答，出于好奇，如果我想在数据中将 Title 设置为 val，我该怎么做？我尝试在玉文件中这样做：- title !{data.title} 但它不起作用
我将编辑答案，cmets 对清晰格式的限制太大。
再次感谢，现在更清楚了。如果我要删除 JSON.stringify 并返回一个对象而不是字符串值，我还能将它分配给 javascript 变量吗？是否可以在 javascript 中使用 data 值设置变量并将标题设置为 data.val ？你想让我把它作为一个单独的问题发布吗？谢谢
是的，更新您的脚本并将 data = !{data} 替换为 var data = !{JSON.stringify(data)}; 。这将解析数据对象客户端以进行 javascript 分配，并且仍然允许您的模板引擎解析模型。
非常感谢您的帮助，非常感谢