Use variable in jade include

Question

I work with Jade and Express, and I would like to use a variable in my include statement. For example:

app.js

app.get('/admin', function (req, res) { var Admin = require('./routes/admin/app').Admin; res.render(Admin.view, { title: 'Admin', page: 'admin' }); }); 

layout.jade

 - var templates = page + '/templates/' include templates 

When I do this, I get an EBADF, Bad file descriptor 'templates.jade' error message EBADF, Bad file descriptor 'templates.jade'

I even tried

 include #{templates} 

to no avail.

Answer 1

AFAIK JADE does not support dynamic inclusion. I suggest "include" outside the template, i.e.

app.js

 app.get('/admin', function (req, res) { var Admin = require('./routes/admin/app').Admin; var page = 'admin'; var templates = page + '/templates/'; // render template and store the result in html variable res.render(templates, function(err, html) { res.render(Admin.view, { title: 'Admin', page: page, html: html }); }); }); 

layout.jade

 |!{ html } 

Answer 2

this also works:

 //controller var jade = require('jade'); res.render('show', {templateRender: jade.renderFile}); //template != templateRender('my/path/'+dynamic+'.jade', options) 

This probably will not increase the performance that you expect from using the 'view cache' parameter (by default it is specified in NODE_ENV == = 'production'). Or even break the application (for example, if the files are not available on the hard disk when deploying new code). Also, an attempt to use this trick on the client side or an isomorphic application will not work because the template cannot be compiled.

Answer 3

I found this page to search on the same issue, but in a different context, so I thought that for posterity my solution (read: workaround):

I would like to surround my inclusion with a large context pulled from a variable, for example. (Simplified):

 - var templates = page + '/templates/' - var headid = page + 'head' - var imgsrc = '/images/' + page div(id=headid) h1 #{page} img(src=imgsrc) div(id=page) include templates 

Since this does not work (Jade does not support dynamic inclusions, as noted by fancy), I am hybridized with mixin:

(Edit is a bit more elegant than my previous workaround :)

 mixin page1 include page1/templates mixin page2 include page2/templates ... - for (var i = 0; i < 3; i++) - var page = 'page' + i - var headid = page + 'head' - var imgsrc = '/images/' + page div(id=headid) h1 #{page} img(src=imgsrc) div(id=page) +page 

My previous answer:

 mixin templates(page) - var headid = page + 'head' - var imgsrc = '/images/' + page div(id=headid) h1 #{page} img(src=imgsrc) +templates('page1') #page1 include page1/templates/ +templates('page2') #page2 include page2/templates/ ... 

It's not elegant, and it won't work if you need to include more than a few things this way, but at least the Jade part is dynamic.

Answer 4

Why not use jade inheritance?

Note what you want at the middleware level:

 res.render('templates/' + template_name + '.jade') 

Write common.jade :

 h1 This is a page .container block sublevel h2 Default content 

Then write a file that extends common.jade :

 extends common.jade block sublevel h2 Some things are here