Как добавить переменную внутри шаблона .EJS

#javascript #node.js #express #ejs

#javascript #node.js #выразить #ejs

Вопрос:

У меня есть страница индекса, страница о программе и страница контактов. У меня также есть файл header.ejs . Внутри header.ejs у меня есть это:

 <a href="/">Home</a> |
<a href="/about">My Resume</a> |
<a href="contact">My Contact Info</a>
<br>
_______________________________________

-----------------------------------------
<br>


<h3>Copyright 2019  Some text here</h3>
  

Я хотел бы использовать точно такой же файл заголовка для страниц index about и contact. Я бы хотел, чтобы содержимое каждой страницы менялось. Это содержимое должно быть размещено внутри сплошной и пунктирной линий. Я не могу использовать отдельные заголовочные файлы. Я могу использовать только одну. Как мне использовать этот же шаблон, но создать пространство и заполнить его разным содержимым для каждой страницы? Вот пример моего индексного файла:

 <!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
  <%include templates/header.ejs%>
    <h1><%= title %></h1>
    <p>Welcome to <%= title %></p>
  </body>
</html>
  

Ответ №1:

добавьте переменную page в свой заголовочный файл :

 <a href="/">Home</a> |
<a href="/about">My Resume</a> |
<a href="contact">My Contact Info</a>
<% if(page=='home') { %>
  // add your home page header content here 
<% }else if(page=='contact'){%>
 // add your contact page header content here 
<% }else if(page=='resume'){%>
 // add your resume page header content here 
<% }else{ %>
  // default header
<% } %>
<h3>Copyright 2019  Some text here</h3>
  

включите ее, передав переменную страницы :

для домашней страницы :

 <%- include('templates/header', {page: 'home'}); %>
  

для страницы контактов :

 <%- include('templates/header', {page: 'contact'}); %>
  

Комментарии:

1. получение ошибки при попытке передать переменную. я поиграю с этим и посмотрю, как правильно передать страницу. большое вам спасибо!!! я действительно ценю помощь

Ответ №2:

При использовании include функции вы должны опустить .ejs .

Например, в вашем index.ejs:

 <%- include 'templates/header' %>
  

Если вы хотите повторно использовать тот же шаблон, вам следует поместить все «необязательное» содержимое, которое вы, возможно, решите отобразить, в отдельный .ejs файл, затем всякий раз, когда выполняется условие, вы можете сделать следующее:

somePage.ejs:

 <p>Welcome to <%= title %></p>
  

someOtherPage.ejs:

 <p>Goodbye <%= title %></p>
  

index.ejs:

 <%- include 'templates/header' %>

<% if (someVar == true) { %>
<%- include 'somePage' %>
<% } %>

<% else if (someOtherVar == true) { %>
<%- include 'someOtherPage' %> 
<% } %>
  

Наконец, на вашем app.js :

 app.get('somePath', function(req, res) {
  res.render('index', {someVar:true, someOtherVar:false}); //pass variables to template like this
});