如何使用 ejs 显示待办事项答案

【问题标题】：How to show todos with ejs如何使用 ejs 显示待办事项
【发布时间】：2020-02-19 00:04:31
【问题描述】：

我在玩 ejs，想知道如何让一些待办事项出现在 html 中？

这是我必须处理的：

app.get("/", (req, res) => {
    db.collection("todoejs")
        .find()
        .toArray((err, todoejs) => {
            res.render("todo");
        });
});

app.post("/create-item", (req, res) => {
    console.log(req.body);
    db.collection("todoejs").insertOne({todo: req.body.item});
    res.redirect("/");
});

我的视图文件夹中有一个 todo.ejs，我想知道如何让 todos 显示。

这是 ejs 文件中的内容：

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Simple To-Do App</title>
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
</head>
<body>
  <div class="container">
    <h1 class="display-4 text-center py-1">To-Do App</h1>

    <div class="jumbotron p-3 shadow-sm">
      <form action="create-item" method="POST">
        <div class="d-flex align-items-center">
          <input name="item" autofocus autocomplete="off" class="form-control mr-3" type="text" style="flex: 1;">
          <button class="btn btn-primary">Add New Item</button>
        </div>
      </form>
    </div>

    <ul class="list-group pb-5">
      <li class="list-group-item list-group-item-action d-flex align-items-center justify-content-between">
        <span class="item-text"><%= todoejs %></span>
        <div>
          <button class="edit-me btn btn-secondary btn-sm mr-1">Edit</button>
          <button class="delete-me btn btn-danger btn-sm">Delete</button>
        </div>
      </li>
    </ul>

  </div>

</body>
</html>

【问题讨论】：

标签： express ejs

【解决方案1】：

res.render 的第二个参数接受你要传递给模板的变量。

在这个例子中，你可能想做res.render("todo", { todoejs: todoejs });

然后todoejs在模板中定义，你可以随意使用它。

【讨论】：