首页 > express做导航栏的问题

express做导航栏的问题

导航栏因为要复用到每个页面是不是要存到locals里面
如何做好

app.route('/')
    .get(function(req,res,next){
        CategoryController.list(function (err, categories){
            if (err) {
              categories = [];
            }
            res.locals.cateList=categories;
            var renderData={
                title:"xxx"
            }
            res.render('index',renderData);
        });
    })

这样做好像不可以把categories存到locals里面,还是只有首页才有,如何做才好?
还是要传到app.js里面的app.use和user放在一起?

app.use(function(req, res, next){
    res.locals.user = req.session.user;
    next();
});

或者做导航栏还是有别的办法比较好


Express的默认模板是Jade(Pug),一般来讲,你Render的页面(如index.jade),都是在extends了(layout.jade)页面模板。

以《Getting MEAN》书中的例子为例:
layout.jade中可以类似:

doctype html
html(ng-app='loc8rApp')
  head
    title= title
    link(rel='stylesheet', href='/stylesheets/style.css')
  body
    .navbar.navbar-default.navbar-fixed-top
      .container
        .navbar-header
          a.navbar-brand(href='/') Loc8r
          button.navbar-toggle(type='button', data-toggle='collapse', data-target='#navbar-main')
            span.icon-bar
            span.icon-bar
            span.icon-bar
        #navbar-main.navbar-collapse.collapse
          ul.nav.navbar-nav
            li
              a(href='/about/') About

    .container
      div(ng-view)
        block content

      footer
        .row
          .col-xs-12
            small © Simon Holmes 2014

    script(src='/angular/angular.min.js')
    script(src='/lib/angular-route.min.js')
    script(src='/angular/loc8r.min.js')
    script(src='/javascripts/validation.js')

你可以把你的导航栏写到layout.jade中,然后,在index.jade中extends layout如:

extends layout

block content
  h1= title
  p Welcome to #{title}

那么,在JS文件中,你可以传入参数:

res.render('index', {
   categories: ['首页', '一级菜单', '二级菜单']
   other: '.....',
   ....
});

至于这个categorieslayout.jade中如何渲染,那就是你的事情了。

不过这样你就不用使用locals了。再说了,你在Controller中,也可以访问req.session.*啊,没必要用在app.use(xxxxx)中的。

欢迎交流。


用模版引擎了吗 比如ejs 然后把菜单导航存一个partial片断里

【热门文章】
【热门文章】