我不能让我的导航栏显示一个编辑配置文件下拉菜单后登录-接收一个错误,一旦登录作为一个艺术家(艺术家=用户)。
错误:
ReferenceError: /Users/myfiles/app/views/layouts/boilerplate.ejs:22
20|
21| <body class="d-flex flex-column vh-100">
>> 22| <%- include('../partials/navbar') %>
23|
24| <main class="container mt-5">
25| <%- include('../partials/flash') %>
/Users/myfiles/app/views/partials/navbar.ejs:21
19| </a>
20| <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
>> 21| <li><a class="dropdown-item" href="/artists/<%=artist._id%>/edit">Edit profile</a></li>
22| <li><a class="dropdown-item" href="/logout">Logout</a></li>
23| </ul>
24| </li>
样板。ejs文件w/navbar partial
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Boilerplate!!</title>
</head>
<body class="d-flex flex-column vh-100">
<%- include('../partials/navbar') %>
<main class="container mt-5">
<%- include('../partials/flash') %>
<%- body %>
</main>
<%- include('../partials/footer') %>
</body>
</html>
navbar.ejs的部分
<nav class="navbar sticky-top navbar-expand-lg navbar-dark" style="background-color: #00305a;">
<div class="container-fluid">
<a class="navbar-brand" href="#">Company</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-link active" href="#">Home</a>
<a class="nav-link active" href="/events">Events</a>
<a class="nav-link active" href="/artists">Artists</a>
</div>
<div class="navbar-nav ms-auto">
<% if(currentUser) {%>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Dropdown
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="/artists/<%=artist.id%>/edit">Edit profile</a></li>
<li><a class="dropdown-item" href="/logout">Logout</a></li>
</ul>
</li>
<a class="nav-link active" href="/logout">Logout</a>
<% } else { %>
<a class="nav-link active" href="/login">Login</a>
<a class="nav-link active" href="/artists/new">Sign Up</a>
<% } %>
</div>
</div>
</div>
</nav>
app.js中的全局变量
app.use((req, res, next) => {
console.log(req.session);
res.locals.currentUser = req.user;
res.locals.success = req.flash('success');
res.locals.error = req.flash('error');
next();
})
我如何构建我的导航栏ejs,以便我可以允许登录的艺术家"编辑";他们的用户资料?我认为这与我在app.js上的全局变量有关,所以我已经包含了文件的一个片段。
弄清楚了——我必须更改ejs变量的名称,因为我已经定义了currentUser:
:href ="/艺术家/& lt; % = artist.id %祝辞/edit"在编辑配置文件
:href ="/艺术家/& lt; % = currentUser.id %祝辞/edit"在编辑配置文件
艺术家的id已经被传递给currentUser,所以我可以把它拉出来。