将nodejs对象存储在pug脚本标签中

编程问答 2022-07-04

问题描述

我有一些对象需要渲染/存储在我的pug文件中，以便以后在客户端JS脚本中使用。

要将对象存储在脚本标签内，我将使用描述为here和here的方法：

NodeJS变量

const object = {
    "someKey": {
        "message":"this works"
    }
}
res.render("index",{object});

pug（文件中的某个位置-请在script标记后注意。）

请注意，我也使用双引号-您可以使用单引号，但我稍后会提及 

script.
    var object = JSON.parse("!{JSON.stringify(object)}")

然后在您的JavaScript脚本中的某处

alert(object.someKey.message)

详细了解帕格插值here。

问题：

对于我所有的用途，上面的示例都可以正常工作。当我有一个带有单引号的对象时出现问题：

const object = {
    "someKey": {
        "message":"this doesn't work"
    }
}

Javascript不喜欢单引号的事实，因为它将单引号视为对象键/值的开始/结束：

从 Chrome控制台获取此信息

enter image description here

原因：

enter image description here

删除此单引号即可解决此问题。达到这一点时，JSON.parse()函数将引发异常并停止加载任何和所有JS，因此，不再有其他函数起作用。 一种解决方法是将其放在页面的最后，但这不能解决问题。

问题：

如何用单引号将对象从NodeJS传递到pug（如上所示）？

更新

使用标准NodeJS发行的MCVE表达样板

https://github.com/cybex-dev/pug-single-quote-isse

设置说明： 

git clone https://github.com/cybex-dev/pug-single-quote-isse
npm install 
npm start

您应该看到期望看到一些控制台输出，我只是看到：

enter image description here

和“错误线”

enter image description here

解决方法

我无法通过以下方式重现您的工作示例：

script.
    var object = JSON.parse("!{JSON.stringify(object)}")

但是对我有用的是：

script.
    var object = !{JSON.stringify(object)};
    console.log(object.someKey.message);

不带双引号：var object = !{JSON.stringify(object)}

expressexpressexpressjavascriptpug