Trang chi tiết thể loại

Bộ điều khiển

Mở tệp /controllers/genreController.js và yêu cầu module Book ở đầu tệp (tệp đó đã có lệnh require() module Genre rồi).

const Book = require("../models/book");

Tìm phương thức bộ điều khiển genre_detail() đã được xuất và thay thế bằng đoạn mã sau.

// Display detail page for a specific Genre.
exports.genre_detail = async (req, res, next) => {
  // Get details of genre and all associated books (in parallel)
  const [genre, booksInGenre] = await Promise.all([
    Genre.findById(req.params.id).exec(),
    Book.find({ genre: req.params.id }, "title summary").exec(),
  ]);
  if (genre === null) {
    // No results.
    const err = new Error("Genre not found");
    err.status = 404;
    return next(err);
  }

  res.render("genre_detail", {
    title: "Genre Detail",
    genre,
    genre_books: booksInGenre,
  });
};

Đầu tiên chúng ta dùng Genre.findById() để lấy thông tin Thể loại theo ID cụ thể, và Book.find() để lấy tất cả bản ghi sách có cùng ID thể loại liên kết đó. Vì hai yêu cầu không phụ thuộc vào nhau, chúng ta dùng Promise.all() để chạy các truy vấn cơ sở dữ liệu song song (cách tiếp cận tương tự để chạy truy vấn song song đã được trình bày trong trang chủ).

Chúng ta await promise được trả về, và một khi nó kết thúc chúng ta kiểm tra các kết quả. Nếu thể loại không tồn tại trong cơ sở dữ liệu (tức là, nó có thể đã bị xóa) thì findById() sẽ trả về thành công mà không có kết quả. Trong trường hợp này chúng ta muốn hiển thị trang "không tìm thấy", vì vậy chúng ta tạo một đối tượng Error và truyền nó vào hàm middleware next trong chuỗi.

Nếu genre được tìm thấy, thì chúng ta gọi render() để hiển thị view. Template view là genre_detail (.pug). Các giá trị cho title, genre và booksInGenre được truyền vào template sử dụng các khóa tương ứng (title, genre và genre_books).

View

Tạo tệp /views/genre_detail.pug và điền nội dung dưới đây:

extends layout

block content

  h1 Genre: #{genre.name}

  div(style='margin-left:20px;margin-top:20px')

    h2(style='font-size: 1.5rem;') Books
    if genre_books.length
      dl
        each book in genre_books
          dt
            a(href=book.url) #{book.title}
          dd #{book.summary}
    else
      p This genre has no books.

View này rất giống với tất cả các template khác của chúng ta. Sự khác biệt chính là chúng ta không sử dụng title được truyền vào cho tiêu đề đầu tiên (mặc dù nó được sử dụng trong template layout.pug cơ bản để đặt tiêu đề trang).

Kết quả trông như thế nào?

Chạy ứng dụng và mở trình duyệt đến http://localhost:3000/. Chọn liên kết All genres, sau đó chọn một trong các thể loại (ví dụ: "Fantasy"). Nếu mọi thứ được thiết lập đúng, trang của bạn trông giống như ảnh chụp màn hình sau.

Cast to ObjectId failed for value " 59347139895ea23f9430ecbb" at path "_id" for model "Genre"

Các bước tiếp theo

• Quay lại Hướng dẫn Express Phần 5: Hiển thị dữ liệu thư viện.
• Tiếp tục đến bài viết con tiếp theo của phần 5: Trang chi tiết sách.