Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/365.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何将Express响应对象传递给前端JS对象_Javascript_Node.js_Express_Handlebars.js_Frontend - Fatal编程技术网

Javascript 如何将Express响应对象传递给前端JS对象

Javascript 如何将Express响应对象传递给前端JS对象,javascript,node.js,express,handlebars.js,frontend,Javascript,Node.js,Express,Handlebars.js,Frontend,我的控制器正在通过res.render将lat/lng数据发送到我的车把视图 res.render('coords', viewModel); “viewModel”包含一个对象数组,每个对象都包含一个位置、lat和lng的名称。我想获取这些信息,并在我的视图中在谷歌地图上绘制标记。当我试图通过手柄将数据注入内嵌JS变量时 <script> var viewMarkers = {{viewModel}}; console.log(viewMarkers); </script&

我的控制器正在通过res.render将lat/lng数据发送到我的车把视图

res.render('coords', viewModel);
“viewModel”包含一个对象数组,每个对象都包含一个位置、lat和lng的名称。我想获取这些信息,并在我的视图中在谷歌地图上绘制标记。当我试图通过手柄将数据注入内嵌JS变量时

<script>
var viewMarkers = {{viewModel}};
console.log(viewMarkers);
</script>

var viewmarks={{viewModel}};
console.log(视图标记);
我把这个放在控制台里

<script>
var viewMarkers = [object Object],[object Object];
console.log(viewMarkers);
</script>

var viewmarks=[object object],[object object];
console.log(视图标记);
我只是Node/Express领域的初学者,似乎无法理解如何将viewModel数据传递到前端的googlemapsjs。我的想法是,我需要执行一个AJAX请求来访问数据。不管怎样,我已经浏览了互联网,但还没有遇到这样的例子,可以使用一些社区指导


我感谢任何知识/帮助

您必须记住,“任务是返回字符串。mustache标记,
{{}
将对象引用作为字符串进行求值,以便将结果文本附加到DOM或HTTP响应体。
标记中的JavaScript在到达客户端之前不会执行。Handlebar无法返回能够在服务器端渲染中生存并最终分配给客户端变量的对象引用

[object object],[object object]
是两个对象的数组字符串化时的结果(即,它是在浏览器控制台中调用
console.log(String([{},{}]);
的输出

为了向客户机交付JavaScript代码,必须构造模板以返回包含有效JavaScript的字符串,其方式与典型模板返回有效HTML的方式大致相同

要做到这一点,漫长的道路如下:

<script>
    var viewMarkers = [
        {{#each viewModel}}
            {
                location: '{{location}}',
                lat: {{lat}},
                lng: {{lng}}
            }
            {{#unless @last}},{{/unless}}
        {{/each}}
    ];
</script>
然后,要呈现JavaScript,只需在模板中执行以下操作:

var viewMarkers = {{{viewModel2}}};
请注意,我们必须使用三个胡子,以避免我们的报价由扶手


我已经创建了一个供您参考。

谢谢您的帮助。奇怪的是,我发现每个字段中都包含“未定义”的对象(我的坏)在我离开控制器之前。一旦修复了,我就能够用res.send将正常的、非结构化的数据传递到您的帖子中的代码,并且手柄填充了viewMarkers数组。同样,没有字符串化,没有手柄模板,什么都没有。根据您的帖子,我认为这是不可能的;italic“Handlebar无法返回一个对象引用,该对象引用可能在服务器端渲染后仍然存在,并最终被分配给客户端上的变量。”@user2305363:我不理解你的评论。你是说
var viewmarks={{viewModel}
为您工作了?如果没有,您做了什么?我很抱歉…我用
res.render('coords',viewModel)从控制器发送了数据,就像平常一样
然后在前端接收到viewModel,其中包含您在上面发布的确切的
脚本
块。Handlebar完全按照您所说的做,返回字符串,因此通过a#重建前端中的对象数组效果很好。@user2305363:好的。太好了!我误解了,以为您在说我的answer不起作用。
var viewMarkers = {{{viewModel2}}};