javascript - 如何将数据从 express.js 传递到与 html 页面相关的 Javascript 代码

标签 javascript html node.js express

我对 express.js 和一般编程还很陌生。我正在尝试学习如何从数据库 (Mongodb) 检索数据并将其发送到 html 文件或 javascript。我设法检索了数据并对其进行了 console.log。我有这段代码,它从数据库中获取名为“数据”的数组并将其记录下来。我想将位置数组的数据传递给我的 html 文件,该文件会提醒该位置。我想我可以简单地将数据作为 Node 模块放在一个 javascript 文件中,然后在另一个 javascript 文件中调用其中的变量。现在我知道如果它是 jade 我可以很容易地在 res.render 之后添加变量。如果我使用 html 并且有一个单独的 javascript 文件,它会如何工作?

这是我的 app.js 代码:

var placeFinder = require ("./public/assets/js/data.js");
app.get('/test', function(req, res){

  placeFinder(function(err, data){
    if(err){
      return res.send(500);
    }    
    res.locals.place = data;
    console.log(data);
    res.render('test', {data: data});
  });
});

这是我的 data.js 代码:

var mongoose = require ('mongoose');  
function getPlaces(callback){
  var data = new Array();
  mongoose.model('stories').find({},function(err, companies) {
    if(err){
      return callback(err, data);
    }
    for (var i = 0; i < companies.length; i++) {
      data[i] = JSON.stringify(companies[i].place);
    }
    return callback(null, data);
 });
}
module.exports = getPlaces;

这是我的 html 和 js 代码:

<html>
<head>
  <title>test</title>
  <script> 
   $('button.showlocation').click( function(){
    var new = {{data}};
    document.write(new);
  }
  </script>
</head>
<body>
<button class="showlocation btn btn-info">Click Here!</button>

</body>
</html>

非常感谢

最佳答案

使用:

res.render('ViewMode', {data: data});

在您的 ViewMode 模板中有一个 var this.data 或只是数据。在您的脚本中,假设您的分隔输出的标签是 {{}}(如 Handlebars :

<script> var places = {{data}}</script>

关于javascript - 如何将数据从 express.js 传递到与 html 页面相关的 Javascript 代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24160493/

相关文章:

javascript - 奇怪的 JavaScript 错误

javascript - 在jQuery中模拟每5秒点击一次空格键

php - 为什么 float 的打印方式如此不同?

javascript - 如何使用express和ejs包含html文件

javascript - Nodemailer 使用 gmail,无法在字符串 'mailer' 上创建属性 'SMTP'

node.js - ReactJS,内部专用 IP 服务器上的 Express 应用程序自托管

javascript - VueJS 传递默认属性而不引用子组件

html - 是否可以在响应式 HTML 电子邮件中将按钮固定在行的底部?

html - 面包屑中的 css3 加载程序对齐

jquery - 填充顶部导致 Div 外的边距 - 了解 DOM