EJS 页眉/页脚不显示

Question

我正在使用 EJS 开发一个基本的待办事项列表应用程序。 我在跑步时得到这个。 我希望能够使用 header 和页脚 EJS 运行 app.js。 除了它不重新调整 header 之外，我确信它是正确的语法。 有什么提示或指示可以帮助我吗？

PS 我所有的 EJS 文件都位于 views 文件夹中

Error: /Users/brenner/dev/web-dev-course/todolist-v1/views/list.ejs:2

Could not find the include file " header"
    1| 
 >> 2| <%- include(" header" ) -%>
    3| 
    4|   <div class="box" id="heading">
    5|     <h1> <%= listTitle %> </h1>

列表.ejs:


  <div class="box" id="heading">
    <h1> <%= listTitle %> </h1>
  </div>

  <div class="box">


    <% newListItems.forEach(function(item){ %>
    <form action="/delete" method="post">
      <div class="item">
        <input type="checkbox" name ="checkbox" value="<%=item._id%>" onChange="this.form.submit()">
        <p><%=  newListItems[i].name  %></p>
      </div>
    </form>

    <% }) %>


    <% for (let i=0; i<newListItems.length; i++) { %>
      <div class="item">
        <input type="checkbox">
        <p><%=  newListItems[i].name  %></p>
      </div>
      <input type="hidden" name="listName" value="<%= listTitle %>"></input>
      <% } %>

      <form class="item" action="/" method="post">
        <input type="text" name="newItem" placeholder="New Item" autocomplete="off">
        <button type="submit" name="list" value="<%= listTitle %>">+</button>
      </form>
  </div>

<%- include("footer") -%>

Header


<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/styles.css"
  </head>
  <body>

页脚


<footer>
  Copyright 2020 Brenner Inc
</footer>

</html> ```

Answer 1

试试这个调用<%- include('header') %> 。 有一个额外空间的错误： ( 'header') 。 应该是('header')

Answer 2

在“views”中创建新目录（文件夹）并将您的 header 和页脚文件放入其中。 并使用

<%- include('partials/header') %>

<!-- your HTML code -->

<%- include('局部/页脚') %>

EJS 页眉/页脚不显示

问题描述

2 个解决方案

解决方案1
1 2020-11-09 11:50:11

解决方案2
0 2023-01-10 10:59:30

EJS 页眉/页脚不显示

问题描述

2 个解决方案

解决方案1 1 2020-11-09 11:50:11

解决方案2 0 2023-01-10 10:59:30

解决方案1
1 2020-11-09 11:50:11

解决方案2
0 2023-01-10 10:59:30