访问客户端JavaScript中的Express.js局部variables

好奇,如果我这样做是正确的,如果不是你们如何处理这个问题。

我有一个Jade模板需要呈现从MongoDB数据库检索到的一些数据,我也需要访问客户端JavaScript文件中的数据。

我正在使用Express.js并将数据发送到Jade模板,如下所示:

var myMongoDbObject = {name : 'stephen'}; res.render('home', { locals: { data : myMongoDbObject } }); 

然后在home.jade里面,我可以做这样的事情:

 p Hello #{data.name}! 

其中写道:

 Hello stephen! 

现在我想要的是也可以访问客户端JS文件中的这个数据对象,所以我可以操纵对象说一个button,然后将其返回到服务器来更新数据库。

我已经能够通过在Jade模板的隐藏input字段中保存“data”对象,然后在我的客户端JS文件中获取该字段的值来实现这一点。

在home.jade里面

 - local_data = JSON.stringify(data) // data coming in from Express.js input(type='hidden', value=local_data)#myLocalDataObj 

然后在我的客户端JS文件我可以像这样访问local_data:

在myLocalFile.js里面

 var localObj = JSON.parse($("#myLocalDataObj").val()); console.log(localObj.name); 

然而,这个string化/parsing业务感觉混乱。 我知道我可以将我的数据对象的值绑定到我的Jade模板中的DOM对象,然后使用jQuery获取这些值,但是我希望能够访问从客户端JS中快速返回的实际对象。

我的解决scheme是最佳的,你们将如何实现这一目标?

渲染完成后,只有呈现的HTML被发送到客户端。 因此没有variables可用了。 你可以做什么,而不是写在input元素的对象作为呈现的JavaScript输出对象:

 script(type='text/javascript'). var local_data =!{JSON.stringify(data)} 

编辑:显然玉需要第一个右括号后的点。

我做的有点不同。 在我的控制器中,我这样做:

 res.render('search-directory', { title: 'My Title', place_urls: JSON.stringify(placeUrls), }); 

然后在我的玉文件的JavaScript中,我使用它是这样的:

 var placeUrls = !{place_urls}; 

在这个例子中,它用于twitter引导types的头插件。 你可以使用这样的东西parsing它,如果你需要:

 jQuery.parseJSON( placeUrls ); 

还要注意,你可以省略当地人:{}。

你听说过socket.io吗? (http://socket.io/)。; 从express中访问对象的简单方法是在node.js和你的javascript之间打开一个套接字。 这样数据可以很容易地传递到客户端,然后使用JavaScript轻松操作。 代码不必太多,只需要一个来自node.js的socket.on()和一个来自客户端的socket.on() 。 我认为这将是一个有效的解决scheme!

使用Jade模板:

如果您在包含的静态HTML文件上方插入@Amberlamps代码片段,请记住指定!!! 5在顶部,以避免造成你的造型破坏,在views / index.jade

 !!! 5 script(type='text/javascript') var local_data =!{JSON.stringify(data)} include ../www/index.html 

这将在实际的静态HTML页面加载之前传入local_datavariables,以便variables从一开始就全局可用。

Serverside(使用Jade模板引擎) – server.js

 app.set('views', __dirname + '/views'); app.set('view engine', 'jade'); app.get('/', ensureAuthenticated, function(request, response){ response.render('index', { data: {currentUser: request.user.id} }); }); app.use(express.static(__dirname + '/www')); 

你不需要在渲染调用中传递局部variables,局部variables是全局variables。 在你的帕格文件调用不要把键expression例如#{} 。 只需使用像: base(href=base.url)

base.urlapp.locals.base = { url:'/' };