如何使用路线来操纵导航栏？

我在layout.hbs中有一个导航栏：

<div class="collapse navbar-collapse" id="collapse"> <ul class="nav navbar-nav navbar-right"> <li><a href={{sign}}>{{issign}}</a></li> <li><a href={{los}}>{{islog}}</a></li> <li><a href="/">Home</a></li> </ul> </div> 

我想在旅途中更改内容，例如，当用户login时，我想将login文本更改为注销，并且还redirect到不同的页面。 我正在通过路线这样做。

 router.get('/', function(req, res, next) { var vm = { title: 'Join Fatty-cruxifinier', sign: 'about', issign : 'SIGNUP', islog: 'LOGIN', los: 'login' }; res.render('signup', vm); }); router.post('/', function(req, res, next) { userServices.addUser(req.body, function(err){ if(err){ var vm = { title: 'Create an account', input: req.body, error: err }; delete vm.input.password; return res.render('signup', vm); } res.redirect('/'); }); }); 

虽然这似乎工作，我需要添加islog ， issign ， los和signvariables到我拥有的每个网页。

有一个更好的方法吗？

Answer 1

你也可以使用res.locals 。 当模板编译时，任何在res.locals中的res.locals都可以在Handlebars上下文中find。 所以你可能会这样做一些中间件：

 app.use((req, res, next) => { // get user from cookie, database, etc. res.locals.user = user; next(); }); 

如果你把这个中间件放在你的其他路由之前，那么这个用户对象就可以用于每一个响应。

然后在您的Handlebars模板中，您只需使用条件：

 {{#if user}} <a href=/logout>Logout</a> {{else}} <a href=/login>Login</a> {{/if}} 

以下是使用类似中间件的实时代码示例： https ： //github.com/digitallinguistics/dlx-org/blob/master/lib/users.js#L38

下面是一个使用该中间件的Handlebars模板的示例： https ： //github.com/digitallinguistics/dlx-org/blob/master/views/layouts/main.hbs#L47

你可以看到我甚至在导航栏中显示用户的名字。

Answer 2

你可以抓住所有路由器，并在每次响应之前运行login逻辑。

 var _ = require('lodash'); var parameters = {}; function isLoggedin(req, res, next) { // check is the user is logged in res.user = { // userdata }; next(); } // catch all the get routes app.get(/^(.*)$/, isLoggedin, function(req, res, next){ if (res.user) { var _parameters = { title: 'Join Fatty-cruxifinier', sign: 'about', issign : 'SIGNUP', islog: 'LOGIN', los: 'login' }; } else { var _parameters = { title: 'Join Fatty-cruxifinier', sign: 'about', issign : 'SIGNUP', islog: 'LOGIN', los: 'login' }; } parameters = _.extend(parameters, _parameters); next(); }); app.get('/account', function(req, res, next){ res.render('signup', parameters); }); 

Answer 3

我在我的项目中做了这个，你可以使用类似的方法：

JS

 var cookieuser = req.cookies.userId || ''; res.render('index', { ID : cookieuser, data : jsonresponse.entries }); 

EJS

  <ul class="dropdown-menu"> <% if(ID.length<=0) { %> <li><a href="/Login">Login</a></li> <% }else{ %> <li><a href="/Logout">Logout</a></li> <li><a href="/History">History</a></li> <% } %> 

它所做的是将userId存储为cookie，该节点读取并传递给标题html。 EJS头检查Id是否为空，如果不是则表示用户已login。基本上有条件地添加li元素。