Question

我正在为快速js框架生成一个把手视图，我需要从一个单独的JavaScript文件中访问我传递给视图的变量。

例如：

var foo = {{user.name}}

有人有个主意吗？帮手？

先谢谢！

PokeRwOw

Answer 1

user.name的值需要输出为有效的JavaScript表达式，如果您想将其包含在<script>中，则会将其重新评估为代码。

目前，如果user.name为"john.doe"，则生成的脚本将为：

var foo = john.doe; // `john` is treated as an object with a `doe` property

user.name至少需要在引号中，因此它被理解为字符串值/文字。

var foo = "{{user.name}}";

// result
var foo = "john.doe";

您还可以利用JSON和JavaScript在语法上的相似性，输出JavaScript可以理解为表达式的JSON，并且已经包含引号。

Handlebars.registerHelper('json', function (content) {
    return JSON.stringify(content);
});

var foo = {{{json user.name}}};

// result
var foo = "john.doe";

请注意上一个示例中的三重{{{...}}}以禁用HTML编码，因此您不会最终得到：

var foo = &quot;john.doe&quot;

Answer 2

Node可以将编码的JSON传递给车把视图，如下所示：

result.render('index', { 
  encodedJson : encodeURIComponent(JSON.stringify(jsonData))
});

把手视图可以像这样解码和解析json：

<script>
  var decodedJson = decodeURIComponent("{{{encodedJson}}}");
  var jsonObj = JSON.parse(decodedJson);
</script>

因为任何传递给把手视图的内容基本上都会直接注入HTML，所以你应该总是传递编码的json并让视图对它进行解码。

我在这个帖子中尝试了其他建议。但他们将未编码的JSON注入到车把视图中，这总是让我解析错误。我不知道人们是如何工作的，因为看起来Handlebars会将变量解析为纯文本。

我还没有读过Handlebars解析器是如何工作的 - 但在我看来，唯一安全的选择是使用编码的JSON，就像我在我的例子中建议的那样。

Answer 3

我也不知道如何在单独的js文件中执行此操作。这些答案使我朝着正确的方向前进，谢谢！在通过渲染将数据传递到页面之前，我最终对服务器端的数据进行了JSON字符串化。但是，我仍然无法使代码在单独的js文件中工作-很好。我的用例是将Materialize输入表单自动完成。

node.js

// code is inside of a router.get block, therefore access to the response(res)

let customerData = {}
// add customer data with a loop, or whatever

const customers = JSON.stringify(customerData)

res.render('path/to/page', {
    customers
})

客户端js

// code placed within script tags of the handlebars file, not a separate js file

const customers = {{{customers}}}

Answer 4

var pageData = "{{pageData}}";
pageData = pageData.replace(/&quot;/g, `"`);
pageData = JSON.parse(pageData)

其中 pageData 是一个对象（可能包含其他对象）

通过javascript访问把手变量

4 个答案:

node.js

客户端js