2014-11-21 9 views
5

Mi piacerebbe rendere una classe 'corrente' su ciascuno dei miei collegamenti di navigazione a seconda di quale pagina sono nel mio modello layout.ejs.Node.js, Express, EJS - Classe attiva nella pagina corrente nella navigazione

Attualmente, il mio indice di controllo espresso assomiglia a questo:

// About 
exports.about = function(req, res) { 
    res.render('content/about.ejs', { 
     title: 'About' 
    }); 
}; 

E nei miei layout.ejs Ho il seguente, che mi piacerebbe essere reso in modo dinamico.

<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> 

Qualche idea su come ottenere questo risultato?

risposta

16

Si potrebbe includere un page_name: 'about' nei dati res.render e poi nel template qualcosa come:

<li <% if (page_name === 'about') { %>class="current" <% } %> ><a href="/about">About</a></li> 

Non ho prove la sintassi, ma questo è il succo del discorso.

+1

Grazie. È davvero corretto, inclusa la sintassi. Molto apprezzato. Non ho ancora alcun potere di voto, quindi accetterò semplicemente la risposta. – dinkco

+0

Un modo per ottenere 'page_name' automaticamente dall'input di' app.get() '? – jeff

+0

'req.path' è probabilmente la cosa più vicina. Vedi [qui] (https://expressjs.com/en/api.html#req.path) per i documenti. Potresti facilmente rimuovere le barre dal percorso per ottenere qualcosa vicino a page_name. Ma i nomi dei percorsi nidificati (ad es. '/ About/fred') non funzionerebbero abbastanza bene allora. Probabilmente potresti cambiare le barre in caratteri di sottolineatura per creare una convenzione in cui la versione sottolineata di req.path (ad esempio, 'req.path.replace (/ \ // g, '_')') ha rappresentato un nome di pagina – thataustin

Problemi correlati