Как показать задачи с ejs - PullRequest
Новая
       7

Как показать задачи с ejs

0 голосов
/ 22 октября 2019

Я играю с ejs и хочу знать, как сделать так, чтобы некоторые html появлялись в 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 в моей папке views и хотел бы знать, как отобразить 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>

1 Ответ

0 голосов
/ 23 октября 2019

Второй параметр res.render принимает переменные, которые вы хотите передать в шаблон.

В этом примере вы можете захотеть сделать res.render("todo", { todoejs: todoejs });

Затем todoejsопределяется в шаблоне, и вы можете использовать его по своему усмотрению.

...