JADE + EXPRESS:迭代内联JS代码中的对象(客户端)?

我想实现一个基于其API的谷歌地图。 我想添加一个基于坐标的path。 因此,我从我的模型中获得我的坐标,并且想要迭代对象以使用这些点填充地图。 在我的玉模板中,我包含了这样的api js代码:

script(type='text/javascript') function initialize() { var myLatLng = new google.maps.LatLng(0, -180); var myOptions = { zoom: 3, center: myLatLng, mapTypeId: google.maps.MapTypeId.TERRAIN }; var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); var flightPlanCoordinates = [ - if (typeof(pins) != null) - var.pins.forEach(function(pin) { new google.maps.LatLng(pin.latitude, pin.longitude), - }) new google.maps.LatLng(0,0) ]; var flightPath = new google.maps.Polyline({ path: flightPlanCoordinates, strokeColor: "#FF0000", strokeOpacity: 1.0, strokeWeight: 2 }); flightPath.setMap(map); } div#map_canvas(style='height: 500px; background-color: #990000;') 

问题是:玉呈现这个片段

 var flightPlanCoordinates = [ - if (typeof(pins) != null) - var.pins.forEach(function(pin) { new google.maps.LatLng(pin.latitude, pin.longitude), - }) new google.maps.LatLng(0,0) ]; 

就像它在玉石模板源文件中那样 – 如果等不被parsing! 有任何想法吗?

谢谢!

整个脚本标记(在它下面缩进的所有东西)都将通过raw传递,而不需要进一步parsing。 玉做HTML模板不HTML模板加嵌套的JavaScript模板。 为了将你的pinsvariables从jade局部模板variables数据传递给脚本源代码,你必须做一些其他的方法,比如使用raw jade来渲染一个小小的脚本标签,它只是将pins数据作为一个文字来调用你的initialize函数,或者把你的pins数据粘贴到某个地方,然后从那里读取。 在脚本标签下面的这些行(伪代码,没有testing过)

 - if (typeof(pins) != null) != "<script type='text/javascript'>" != "var pins = [];" - forEach pin in pins != "pins.push(new Pin(" + pin.latitude + ", " + pin.longitude + "));" != "initialize(pins);" != "</script>" 

我把这个值作为隐藏的input元素来传递,例如:

  input(type='hidden', id='variableName', value='#{variableName}') 

通过jQuery访问:

  $("#variableName").val() 

你可以使用这个:

 script console.log(#{var_name}); 

脚本标签纯粹是文本,你不能轻易地混合翡翠来生成这个JavaScript,通常是一个糟糕的devise反映。 您可以将客户端所需的JSON序列化,或者使用express-expose来执行此操作

服务器端

 JSON.stringify(users) 

客户端

 var users=JSON.parse(("#{users}").replace(/&quot;/g,'"')); 

我有一个类似的问题,这行代码解决了它:

 var myvar = !{JSON.stringify(mydata)}; 

答案来自这个职位