将参数从服务器端传递到客户端Node.js表达

时间:2016-03-03 18:46:05

标签: node.js express

尝试使用Express。

将参数从服务器端传递到Node.js中的客户端

我在服务器端使用以下命令:

for (var i = 0; i < events.length; i++) 
{
    existingEvents.push(events[i]);
}
res.render('index', { locals: {existingEvents: existingEvents}});

以下代码在客户端(jade),在脚本部分

var events = "";
      for (var i = 0;i < existingEvents.length;i++)
        {
             if (i == 0)
             {
                 events = "events: [{title: '" + existingEvents[i].summary +"', start: '" + existingEvents[i].start.dateTime + "',constraint: 'businessHours'}";
             }
             else
             {
                 events += ", { title: 'aaaaaaaaa', start: '2016-03-03T13:00:00',constraint: 'businessHours'}";
             }
        }events += "]";

当我在chrome上调试时,我遇到有关existingEvents的以下错误:

&#34;未捕获的ReferenceError:未定义existingEvents&#34;。

我看过这篇文章:Accessing Express.js local variables in client side JavaScript 并尝试了各种方法来实现它。 (例如试过#{existingEvents})。

但到目前为止没有任何效果。你们怎么做到这一点? 非常感谢你的帮助:)。

3 个答案:

答案 0 :(得分:2)

试试这个:

for (var i = 0; i < events.length; i++) 
{
    existingEvents.push(events[i]);
}
res.render('index', { existingEvents: existingEvents });

和玉:

script(type="text/javascript").

    var existingEvents = !{JSON.stringify(existingEvents)};

    var events = "";
    for (var i = 0; i < existingEvents.length; i++)
    {
         if (i == 0)
         {
             events = "events: [{title: '" + existingEvents[i].summary +"', start: '" + existingEvents[i].start.dateTime + "',constraint: 'businessHours'}";
         }
         else
         {
             events += ", { title: 'aaaaaaaaa', start: '2016-03-03T13:00:00',constraint: 'businessHours'}";
         }
    } 
    events += "]";

答案 1 :(得分:2)

在调用代码之前,将以下内容放入jade模板中:

script(type="text/javascript").
    existingEvents = !{JSON.stringify(existingEvents)};

这将在javascript中创建一个existingEvents全局变量,您可以使用后者。

答案 2 :(得分:1)

如果在页面呈现时,您想要将一些变量传递给客户端Javascript,那么您只需在页面中生成<script>标记并定义Javascript变量即可。这通常作为页面模板呈现的一部分完成,以便生成的网页包含以下内容:

<script>
var existingEvents = {...};   // some Javascript data in here
</script>

您对该呈现的脚本标记的准确程度完全取决于您正在使用的页面呈现模板引擎。

然后,网页中的Javascript代码可以引用页面中的existingEvents变量。

如果页面已经加载并且在浏览器中运行,页面Javascript想要从服务器动态获取一些数据,那么它可以向服务器发出Ajax调用并请求数据。服务器将实现该Ajax调用的路由并以JSON格式返回数据。然后,客户端将解析该JSON结果,并根据需要使用数据。