問題描述
我想根據(jù)我在 layout.ejs 模板中的頁面在每個導(dǎo)航鏈接上呈現(xiàn)一個當(dāng)前"類.
I'd like to render a 'current' class on each of my navigation links depending on which page I'm on in my layout.ejs template.
目前,我的快速控制器索引如下所示:
Currently, my express controller index looks like this:
// About
exports.about = function(req, res) {
res.render('content/about.ejs', {
title: 'About'
});
};
在我的 layout.ejs 中,我希望動態(tài)呈現(xiàn)以下內(nèi)容.
And in my layout.ejs I have the following, which I'd like be rendered dynamically.
<ul class="nav" id="nav">
<li><a href="/">Home</a></li>
<li class="current"><a href="/about">About</a></li>
<li><a href="/">Contact</a></li>
</ul>
關(guān)于如何實現(xiàn)這一點的任何想法?
Any ideas of how to achieve this?
推薦答案
你可以在 res.render
數(shù)據(jù)中包含一個 page_name: 'about'
然后在模板之類的:
You could include a page_name: 'about'
in the res.render
data and then in the template something like:
<li <% if (page_name === 'about') { %>class="current" <% } %> ><a href="/about">About</a></li>
我沒有測試語法,但這就是要點.
I didn't test the syntax, but that's the gist.
這篇關(guān)于Node.js、Express、EJS - 導(dǎo)航中當(dāng)前頁面上的活動類的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網(wǎng)!