这是我一个多月以来参与的一个更大项目的一些片段。我花了大约 6 个小时进行故障排除,一切都融合在一起。
在转换为 EJS 之前,一切都很完美。
我并不是在寻找彻底的解决方案,但我对 EJS 是全新的,所以在我恢复到 HTML 上的 Vanilla JS 之前,正确的方向会拯救我。这里肯定有什么问题。
错误:
ReferenceError:赋值中左侧无效 在新函数()处 在 Template.compile (/home/bob/Documents/Programming/Portfolio/node_modules/ejs/lib/ejs.js:626:12) 在 Object.compile (/home/bob/Documents/Programming/Portfolio/node_modules/ejs/lib/ejs.js:366:16) 在handleCache(/home/bob/Documents/Programming/Portfolio/node_modules/ejs/lib/ejs.js:215:18) 在 tryHandleCache (/home/bob/Documents/Programming/Portfolio/node_modules/ejs/lib/ejs.js:254:16) 在 View.exports.renderFile [作为引擎] (/home/bob/Documents/Programming/Portfolio/node_modules/ejs/lib/ejs.js:459:10) 在 View.render (/home/bob/Documents/Programming/Portfolio/node_modules/express/lib/view.js:135:8) 在 tryRender (/home/bob/Documents/Programming/Portfolio/node_modules/express/lib/application.js:640:10) 在 Function.render (/home/bob/Documents/Programming/Portfolio/node_modules/express/lib/application.js:592:3) 在 ServerResponse.render (/home/name/Documents/Programming/Portfolio/node_modules/express/lib/response.js:1012:7)
.ejs 文件:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Services</title>
<meta name="services" contents="Services Page">
<link rel="stylesheet" href="styles.css" />
<script src="store.js" async></script>
</head>
<body>
<header class="main-header">
<nav class="nav main-nav">
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="services.html">SERVICES</a></li>
<li><a href="about.html">ABOUT</a></li>
</ul>
</nav>
<h1 class="my-name my-name-large">My Name</h1>
</header>
<section class="container content-section">
<h2 class="section-header">STARTUP</h2>
<div class="service-items">
<% items.startup.forEach(function(item){ %>
<div class="service-item shop-item" data-item-id="<%= item.id %>">
<span class="service-item-title"><%= item.name %></span>
<img class="service-item-image" src="Images/Services/<%= item.imgName %>" height="96px" width="96px">
<div class="service-item-details">
<span class="service-item-price">$<%= item.price /1= 100 %></span>
<button class="btn btn-service shop-item-button" type="button">ADD TO CART</button>
</div>
</div>
<% }) %>
</div>
<h2 class="section-header">RESOURCES</h2>
<div class="service-items">
<% items.startup.forEach(function(item){ %>
<div class="service-item shop-item" data-item-id="<%= item.id %>">
<span class="service-item-title"><%= item.name %></span>
<img class="service-item-image" src="Images/Services/<%= item.imgName %>" height="96px" width="96px">
<div class="service-item-details">
<span class="service-item-price">$<%= item.price /1= 100 %></span>
<button class="btn btn-service shop-item-button" type="button">ADD TO CART</button>
</div>
</div>
<% }) %>
</div>
<h2 class="section-header">CONSULTING</h2>
<div class="service-items">
<% items.startup.forEach(function(item){ %>
<div class="service-item shop-item" data-item-id="<%= item.id %>">
<span class="service-item-title"><%= item.name %></span>
<img class="service-item-image" src="Images/Services/<%= item.imgName %>" height="96px" width ="96px">
<div class="service-item-details">
<span class="service-item-price">$<%= item.price /1= 100 %></span>
<button class="btn btn-service shop-item-button" type="button">ADD TO CART</button>
</div>
</div>
<% }) %>
</div>
</section>
<section class="container content-section">
<h2 class="section-header">CART</h2>
<div class="cart-items-header">
<div class="service-item-details">
<span class="cart-item cart-column-header cart-header">ITEM</span>
<span class="cart-price cart-column-header cart-header">PRICE</span>
<span class="cart-quantity cart-column-header cart-header">QUANTITY</span>
</div>
</div>
<div>
<div class="cart-items">
</div>
<div class="cart-total">
<strong class="cart-total-title">Total</strong>
<span class="cart-total-price">$0.00</span>
<button class="btn btn-primary btn-purchase" type="button">PURCHASE</button>
</div>
</div>
</section>
<footer class="main-footer">
<div class="container main-footer-container">
<h3 class="my-name">my-name</h3>
<ul class="nav footer-nav">
<li>
<a href="mywebsite.com"><img src="./Images/Icons/Youtube.png" height="48px" width="48px"></a>
</li>
<li>
<a href="mailto:bob@bbass.co" target="_blank"><img src="./Images/Icons/Gmail.png" height="48px" width="48px"></a>
</li>
<li>
<a href="https://www.github.com/716green" target="_blank"><img src="./Images/Icons/Github.png" height="48px" width="48px"></a>
</li>
</ul>
</div>
</footer>
</body>
</html>
最佳答案
就是这一行:
<span class="service-item-price">$<%= item.price /1= 100 %></span>
你的意思可能是
<span class="service-item-price">$<%= item.price / 100 %></span>
关于javascript - 从 HTML 转换后 EJS 导致渲染错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60134177/