Get compiled jade template inside view?

Question

Get compiled jade template inside view?

I have a "partial" template that I want to use both client-side and server-side.

Is there some method or filter or something that's very similar to include except that instead of executing the template immediately, it returns a client-compiled function which I could then assign to a JS variable and use throughout my script?

At present, I'm doing this:

exports.list = function(req, res){
    res.render('file/list', {
        ...
        fileItemTemplate: jade.compile(fs.readFileSync(path.join(req.app.get('views'),'file','file-item.jade')), {client: true})
    });
};

And then in my template I have:

ul#folder-list.thumbnails
    each file in files
        include file-item

...

script(type='text/javascript')
    var fileItemTemplate = !{fileItemTemplate};

And in this way I can render some items to HTML on page-load, and then add some more in later by rendering the partial as data comes in.

This works, but it doesn't feel very DRY because I have to read in the file, and deal with filepaths and stuff in the route, and then essentially redeclare the exact same variable client-side.

Is there a nice way of doing this?

Something like this would be ideal:

script(type='text/javascript')
    var fileItemTemplate = !{compile file-item};

node.js
express
jade

Answer 1

A possible solution could be JadeAsset. See also the discussion here.

You can hook assets into Express:

assets.on('complete', function() {
    var app = express.createServer();
    app.configure(function() {
        app.use(assets);  // that's all you need to do
    });
    app.listen(8000);
});

To create your Jade assets:

var assets = new AssetRack([
    new rack.JadeAsset({
        url: '/templates.js',
        dirname: __dirname + '/templates'
    })
]);