使用 Node.js 和 Express 将 JSON 数据集显示为表格答案

【问题标题】：Displaying a JSON dataset as a table with Node.js and Express使用 Node.js 和 Express 将 JSON 数据集显示为表格
【发布时间】：2016-04-20 23:34:40
【问题描述】：

首先，我想指出我对 Node.JS 非常陌生。我正在尝试使用 NodeJS 制作一个包含多个表格和信息的页面。我的问题是，我无法将 SQL 查询的结果放入 HTML 表中。目前我使用 express 将.send 的数据转换为 HTML 页面。

我使用的代码：

    var http = require('http');
    http.createServer(function(req, res) {});
      var mysql = require("mysql"); 
      var express = require('express');
      var app = express();
      console.log('Creating the http server');
      con.query('SELECT id ,name FROM customer', function(err, rows, fields)
    {
        console.log('Connection result error '+err);
        console.log('num of records is '+rows.length);

        app.get('/', function (req, res) {
          res.send(rows);
        });

    });

    app.listen(3002, function () {
      console.log('Example app listening on port 3000!');
    })

这会在我的 HTML 页面上打印我的 sql 语句中的所有数据：

{"id":"1","name":"Robert"}
{"id":"2","name":"John"}
{"id":"3","name":"Jack"}
{"id":"4","name":"Will"}

我想要的结果是：

id              Name
1               Robert
2               John
3               Jack
4               Will
..etc

这甚至可以在 Node JS 中实现吗？

【问题讨论】：

我正在尝试创建一个表。对错误的建议深表歉意。
所以您想在 HTML 表格中显示结果集？（在数据库术语中，创建表是另一回事）
我想在我的 HTML 页面中创建一个表格，而不是在我的数据库中
有多种方法，您可以将其呈现为服务器端的表格，也可以从客户端获取 JSON，循环遍历并在那里制作表格，您更喜欢哪一个？
我认为对我来说最好的方法是使用 JSON

标签： javascript html mysql node.js express

【解决方案1】：

我建议您查看Jade。它是一个 node js 的模板引擎，可用于创建 html 页面。它易于使用且非常灵活。

找到了一个很好的教程here。它向您展示了如何使用 Node、Express 和 Jade 创建一个简单的网站，我认为这是一个很好的起点。

为了解决您的 Jade 问题，stackoverflow 中有几个答案，例如 here。

【讨论】：

感谢您提供的提示，我确实查看了 Jade 并设法将模板放在一起，但我仍然不知道如何在我的页面中获取表格。我在哪里放置表格的代码？（布局或索引）
如果您的问题是指我推荐的教程，我会将代码放在索引中（但这并不重要）。稍后教程在 app.get(...) 部分解释 res.render(...) 用于在客户端显示您的布局。该教程非常好，因此请逐步进行并确保您对正在发生的事情有所了解。 Jade 一开始可能会让人困惑，但只要稍微玩一下，看看会发生什么

【解决方案2】：

类似于 Jade 你可以使用Embedded JS

<table>
  <tr>
    <th>id</th><th>Name</th>
  </tr>

  <% for (var i = 0; i < data.length; i++) { %>
    <tr>
      <td><%= data[i].id %></td>
      <td><%= data[i].name %></td>
    </tr>    
  <% } %>
</table>

这将遍历一个对象数组（我已将其保存为 data 并基于此填充一个表。

【讨论】：