从Jade传递变量到JavaScript

Question

我将尝试将一个变量从路由处理程序传递到JavaScript文件。

获取主页的Express路由如下：

exports.home = function(req, res){

    var _ajaxData = [ ["#collections","collections", "Collections"],
                      ["#candidates","candidates", "Candidates"],
                      ["#entries","entriess", "Entries"],
                      ["#exits","exits", "Exits"]
                    ];

    res.render('home/home', { title: 'Welcome to My Web', _ajaxData: _ajaxData});
};

我的Jade文件如下：

extends ../layout/base

block content
      each item in _ajaxData
        div(id= item[0]).col-md-6
              h3.panel-title= title
            .panel-body
              | Loading content...

  script(src='js/home.js')

这个内容是在home.js中通过ajax加载的，代码如下所示：

var ajaxData = JSON.stringify('!{_ajaxData}');
console.log(ajaxData);
// Further processing here

问题：控制台输出：

"!{_ajaxData}" 

我希望能够将完整的数组传递给JavaScript，请提供任何见解。

感谢任何建议。

- Kiran

---

顺便提一下：我发现浏览器在没有经过 Express 处理的情况下就获取了 home.js。但是，我仍然想知道是否有更好的方法来做这件事。 - Kiran

Answer 1

在你的jade文件中添加这个。

script(type='text/javascript')                                                   
  var local_data =!{JSON.stringify(data)};   
script(src='javascripts/myScript.js')  

你的所有数据现在应该在local_data中，供myScript.js使用。

- bzupnick

---

感谢您的反馈，已经进行了小修改： script(type='text/javascript') | var local_data =!{JSON.stringify(data)}; script(src='javascripts/myScript.js') - Kiran

否则，它会将变量转换为<var>。 - Kiran

您应该在脚本后添加 . 字符，例如 script(type='text/javascript').，以便您的代码被视为文本而不是模板。 - Jon Miles

Jonathan是正确的，作为参考，这最近有所改变。在旧版本中，jade会理解任何嵌套在script标签内部的内容都是js块而不是更多的模板；在最近的版本（从1.0.0之后记忆中）中，您需要使用尾随点或管道字符。 - Jed Watson

非常感谢您的回答 :) - Sudhanshu Gaur