在JavaScript中使用Handlebars对象

Question

我想将整个对象直接传递到javascript中，但它似乎不起作用。我尝试了{{{data}}}方法和另一篇文章中推荐的{{data}}方法。我正在车把文件中做这样的事情：

<script>
  var myData = {{data}}; // or even {{{data}}}
</script>

这两个都给了我一个例外：未捕获的语法错误：意外标识符。但是，如果我做

var myDataUrl = "{{data.url}}";

它工作得很好，但对于第一种情况，它会打印出"[Object Object"]。关于如何使案例1发挥作用，有什么想法吗？

Answer 1

要将Javascript数据直接插入到模板中，需要将其转换为合法的Javascript字符串，并将该字符串传递到模板中。在到达模板之前，它需要是合法的Javscript。使用类似JSON.stringify()的东西是制作合法Javascript的一种方法，但这并不是唯一的方法。

下面是我的一个手把模板中的一个片段，它将一些javascript数据结构插入到HTML文件中：

<script>
// temperature data - array of arrays of the form [dateTime, atticTemp, outsideTemp]
var temperatureData = {{{temperatures}}};
// onOffData is an array of [dateTime, str] - where str is "on" or "off"
var onOffData = {{{onOffData}}};
</script>

并且，传递给模板的数据看起来是这样的（两个方法调用返回JSON字符串）：

app.get('/chart', function(req, res) {
    var tempData = {
        temperatures: data.getTemperatureDataSmallJSON(),
        onOffData: data.getFanOnOffDataSmallJSON(),
        units: req.cookies.temperatureUnits
    };
    res.render('chart', tempData);
});

---

这会产生一段HTML文件，看起来像这样：

<script>
// temperature data - array of arrays of the form [dateTime, atticTemp, outsideTemp]
var temperatureData = [[1412752013861,22.19,16.35],[1412753505591,22,16.15],[1412754286561,21.85,15.94]];
// onOffData is an array of [dateTime, str] - where str is "on" or "off"
var onOffData = [[1411786960889,"off"],[1411790853867,"off"]];
</script>

注意，我将数据转换为JSON，并将JSON字符串传递到模板中。