nodejs ejs将数组对象渲染到表中答案

【问题标题】：nodejs ejs render array object in to tablenodejs ejs将数组对象渲染到表中
【发布时间】：2021-10-11 16:35:29
【问题描述】：

美好的一天我需要从数据库中编写一个表，如果数组大于 1，我无法访问这些值... 如果我这样做：

    //spielzeiten
   var spielzeitenArr = [{
        spzeit: "",
        spielzeit_id: "",
    }];
    var spzeitData = await myDB.selectSpielzeit();

    for (var i = 0; i < 1/*spzeitData.length*/; i++) {
        spielzeitenArr[i].spzeit = "meine Zeit" /*spzeitData.spzeit*/;
        spielzeitenArr[i].spielzeit_id = "meine ID"/*spzeitData.spielzeit_id*/;
    }

        res.render('index', {
            firmen: firmanameArr,
            block: blocknameArr,
            datei: dateinameArr,
            jinglein: jingleinArr,
            jingleout: jingleoutArr,
            szdata: spielzeitenArr
        });

在 ejs 端它看起来像这样：

        <table id="todoTable">
            <tr>
                <td class="tdList">Datum</td>
                <td class="tdList">Zeit</td>
                <td class="tdList">Start Jingle</td>
                <td class="tdList">End Jingle</td>
                <td class="tdList">Name</td>
                <td class="tdList">
                    <div class="select-wrapper">
                        <select id="categoryFilter" class="selectCompany"></select>
                    </div>
                </td>

                <% szdata.forEach((item) => { %>
            <tr></tr>
            <td><%= item.spzeit %></td>
            <td><%= item.spielzeit_id %></td>
            <% }); %>
        </table>

如果我使用我的硬编码值，它可以工作。但是如果我尝试将 i 值更改为 2 或更大，它会给我一个错误...为什么会这样？

非常感谢您的帮助！

【问题讨论】：

您可以自己回答这个问题，方法是在 for 循环之前使用 console.log(`data length: ${spzeitData.length}`)，并查看控制台输出。您几乎肯定会看到data length: 0，如果您希望看到不同的值，请开始调试myDB.selectSpielzeit()，看看为什么它会为您提供一个空数组。

标签： javascript node.js ejs

【解决方案1】：

您正在初始化长度为 1 的 spielzeiten 数组，如果您有多个记录，则不会增加其大小。因此，当然，如果您尝试使用不同于 0 的索引访问 spielzeiten[i].spzeit，您会收到错误。

您可能应该将数组初始化为空数组并在循环期间添加新项目。

spielzeiten = [];

for (let i = 0; i < spzeitData.length; i++) {
  spielzeiten.push({
    spzeit: spzeitData[i].spzeit,
    id: spzeitData[i].spielzeit_id
  });
}

您也可以使用Array.map 函数直接初始化您的数组

let spielzeiten = spzeitData.map(d => ({ 
  spzeit: d.spzeit, 
  id: d.spielzeit_id
}));

【讨论】：