作者列表頁面和型別列表頁面挑戰
作者列表頁面需要顯示資料庫中所有作者的列表,每個作者姓名連結到其關聯的作者詳細資訊頁面。出生日期和死亡日期應在同一行上列在姓名之後。
控制器
作者列表控制器函式需要獲取所有Author例項的列表,然後將它們傳遞給模板進行渲染。
開啟/controllers/authorController.js。找到檔案頂部附近匯出的author_list()控制器方法,並將其替換為以下程式碼。
// Display list of all Authors.
exports.author_list = asyncHandler(async (req, res, next) => {
const allAuthors = await Author.find().sort({ family_name: 1 }).exec();
res.render("author_list", {
title: "Author List",
author_list: allAuthors,
});
});
路由控制器函式遵循與其他列表頁面相同的模式。它在Author模型上定義一個查詢,使用find()函式獲取所有作者,並使用sort()方法按字母順序對他們進行排序,family_name。exec()在末尾進行菊花鏈式連線,以便執行查詢並返回函式可以await的承諾。
承諾履行後,路由處理程式將渲染author_list(.pug)模板,使用模板鍵傳遞頁面title和作者列表(allAuthors)。
檢視
建立/views/author_list.pug並將它的內容替換為下面的文字。
extends layout
block content
h1= title
if author_list.length
ul
each author in author_list
li
a(href=author.url) #{author.name}
| (#{author.date_of_birth} - #{author.date_of_death})
else
p There are no authors.
執行應用程式並在瀏覽器中開啟https://:3000/。然後選擇所有作者連結。如果一切設定正確,頁面應該看起來像下面的截圖。
注意:作者生命週期日期的外觀很醜!您可以使用與用於BookInstance列表(將生命週期的虛擬屬性新增到Author模型)相同的方法來改進它。
但是,由於作者可能沒有去世或可能缺少出生/死亡資料,在這種情況下,我們需要忽略缺少的日期或對不存在的屬性的引用。一種解決方法是根據屬性是否已定義,返回格式化的日期或空字串。例如
return this.date_of_birth ? DateTime.fromJSDate(this.date_of_birth).toLocaleString(DateTime.DATE_MED) : '';
型別列表頁面 - 挑戰!
在本節中,您應該實現自己的流派列表頁面。該頁面應顯示資料庫中所有流派列表,每個流派連結到其關聯的詳細資訊頁面。下面顯示了預期結果的螢幕截圖。
流派列表控制器函式需要獲取所有Genre例項的列表,然後將它們傳遞給模板進行渲染。
- 您需要編輯/controllers/genreController.js中的
genre_list()。 - 實現幾乎與
author_list()控制器完全相同。- 按名稱升序排列結果。
- 要渲染的模板應該命名為genre_list.pug。
- 要渲染的模板應傳遞變數
title('Genre List') 和genre_list(從您的Genre.find()回撥返回的流派列表)。 - 檢視應與上面的螢幕截圖/要求匹配(這應該與作者列表檢視具有非常相似的結構/格式,但流派沒有日期)。
下一步
繼續第 5 部分的下一篇文章:流派詳細資訊頁面。