2017-06-20 1 views
0

Ich verwende Express 4 - ejs Kombination für meine Webanwendung, und ich frage mich, wie kann ich mehrere Dateien abhängig von der Route/URL, die aufgerufen werden.Mehrere Dateien auf Express anrufen - EJS

Lassen Sie uns sagen, dass ich header.ejs, dass ich auf jeder Seite machen möchten, und header.ejs Code ist:

<div class="wrapper"> 
    <div class="header-area">Header IS Gonna Be Here</div> 
    <div class="content-area">Content Area Gonna Be Different on Every Page Depend on the Router</div> 
</div> 

Meine bestehende Methode, um die header.ejs Datei in Aufruf using res.render() ist, aber ich kann nicht Finde es heraus, um mehrere Dateien gleichzeitig zu rendern. Danke für deine Antwort, wenn du meinst, dass meine Frage bereits gestellt wurde, kannst du mir den Link geben, dann werde ich es überprüfen.

Antwort

0

Das Konzept nennt sich Templating Ihr Layout, im Grunde erstellen die Partials wie Header-Fußzeile, die statisch bleiben.

app.get('/', function(req, res){ 
    res.render('index',{user:"John Smith"}) 
// pass main ejs file name, pass any data variables 
}); 

Um Datei mit dem Namen index.ejs, kombiniert mit anderen ejs Dateien zu machen mit include-Anweisung: auf res.render() erhalten Sie die Ansicht mit den Daten, die Sie benötigen, und fügen Sie zu, dass die Kopf- und Fußzeilen machen. wie Sie ursprünglich festgelegt haben

<!DOCTYPE html> 
< html lang="en"> 
    < head> 
    <% include ../partials/head %> 
    </ head> 
    < body class="container"> 
    < header> 
     <% include ../partials/header %> 
    </ header> 
    < main> 
     < div class="jumbotron"> 
     < h1> This is great </ h1> 
     < p> Welcome to templating using EJS </ p> 
     < p> welcome <%= user%>;< /p> 
     </ div> 
    </ main> 
    < footer> 
     <% include ../partials/footer %> 
    </ footer> 
    </ body> 
</ html> 

Check for tutorial

+0

und wie unterscheiden Sie sicherstellen, dass index.ejs im Blick Verzeichnis ist die Datei auf andere Route aufzunehmen? – myd07

+0

überprüfen Sie die aktualisierte Antwort. –

+0

danke, es hat funktioniert – myd07

Verwandte Themen