如何使用“Flat Json”-Bootstrap 5 Table 示例与 ejs + nodejs + expressjs答案

【问题标题】：How to use "Flat Json"-Bootstrap 5 Table example with ejs + nodejs + expressjs如何使用“Flat Json”-Bootstrap 5 Table 示例与 ejs + nodejs + expressjs
【发布时间】：2021-04-21 22:23:04
【问题描述】：

我想使用“Flat Json”-Bootstrap 5 Table 示例。 [链接][1]

我将 expressjs 与 nodejs 和 ejs 一起使用。到目前为止我的代码：

```<link href="https://unpkg.com/bootstrap-table@1.18.1/dist/bootstrap-table.min.css" rel="stylesheet">
 <script src="https://unpkg.com/bootstrap-table@1.18.1/dist/bootstrap-table.min.js"></script>

<body>
    <h2>JOB DASHBOARD</h2>

    
<table id="table" data-toggle="table" data-flat="true" data-search="true" >
  <thead>
    <tr>
        <th data-field="" data-sortable="true">Order ID</th>
        <th data-field="" data-sortable="true">Liefertermin</th>
        <th data-field="" data-sortable="true">Fertigstellungstermin</th>
        <th data-field="" data-sortable="true">Keyline Nr</th>
    </tr>
  </thead>
  <tbody>
    <% var count = 0; %>
    <% orders.forEach((order)=>{  %>
        <tr data-index="<%= count %>">
            <td><%= order.order_id %></td>
            <td><%= order.due_at %> </td>
            <td><%= order.deliver_at %> </td>
            <td><%= order.keyline_obj.event.data.attributes.reference %> </td>
        </tr>
        <% count +=1; %>
    <% }) %>
  </tbody>
</table>
</body>
</html>```

我正在从我的 mongoDB 数据库加载内容。变量“orders”是一个订单文档数组。目前数据正在加载，但搜索字段根本没有出现，所有样式都不起作用，尽管我已经加载了 bootsrap css 和 js。 [1]：https://examples.bootstrap-table.com/index.html?bootstrap5#welcomes/flat-json.html

【问题讨论】：

标签： node.js express html-table ejs bootstrap-5

【解决方案1】：

我认为问题在于发送成功，但响应在 json 中，因为浏览器正在等待

您可以通过 => 在屏幕上单击鼠标右键 => 按检查 => 网络 => 单击页面文件 => 然后选择响应来检查数据是否收到

您将找到包含更新数据的 html 页面

你可以像这样在获取 api 之后从你的 js 脚本中渲染它

await fetch(----your fetching code-----).then(res=>{
    document.open();
    res.text().then(function(text) {
    document.write(text)
        });
    })

【讨论】：