使用 EJS 在列表中显示数组

Col*_*ere 2 javascript arrays ejs node.js

我正在制作一个简单的待办事项列表来学习 Node.js,并使用 EJS 进行模板化。我正在使用 for 循环来循环访问我设置的数组,以显示列表中的每个项目,并添加一个表单供用户添加到列表中。我的问题是,现在我已经创建了这个数组,但我尝试渲染它的地方什么也没有出现。显示数组时是否缺少某些内容?

编辑:我应该解释一下,我的特定代码(对于一个类)专门使用 for 循环而不是 forEach() 方法。我的问题也应该反映出我看不到我的代码和 stackoverflow 上其他一些代码之间的区别,因为这是一个拼写错误。

列表.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>To Do List</title>
</head>
<body>
<h1><%= whichDay %></h1>

<ul>
    <% for (var i = 0; i < newListItems; i++) { %>
        <li> <%= newListItems[i] %> </li>
    <% } %>
</ul>

<form class="new-item" action="/" method="POST">
    <input type="text" class="" name="newItem" placeholder="Add to list">
    <button type="submit" name="button">Add</button>
</form>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

应用程序.js

const bodyParser = require(`body-parser`);
const express    = require(`express`);
const app        = express();
//list of items added by user
var listOfItems = ["Something in this list"];

app.set(`view engine`, `ejs`);

app.use(express.static(`public`));
app.use(bodyParser.urlencoded({extended:true}));

app.get(`/`, function(req, res){
    //get full date
    var today = new Date();
    //set the current date to an integer (saturday==6)
    var options = {
        weekday: "long",
        day:     "numeric",
        month:   "long"
    };

    var day = today.toLocaleDateString(`en-US`, options);
    //render the given day inside list.ejs using 'whichDay' key
    res.render(`list`, {whichDay: day, newListItems: listOfItems});
});

app.post('/', function(req, res){
    //save 'item' form data
    var item = req.body.newItem;
    //push 'item' data to 'items' array
    listOfItems.push(item);
    //reload to root
    res.redirect("/");
});

app.listen(3000, function(){
    console.log(`Server running`)
})
Run Code Online (Sandbox Code Playgroud)

Sau*_*try 6

使用 for 循环:

<ul>
    <% for (var i = 0; i < newListItems.length ; i++) { %>
        <li> <%= newListItems[i] %> </li>
    <% } %>
</ul>
Run Code Online (Sandbox Code Playgroud)

使用 forEach 循环:

<ul>
        <% newListItems.forEach(function(item,index){ %>
            <li> <%= item %> </li>
        <% }) %>
    </ul>
Run Code Online (Sandbox Code Playgroud)