Pergunta

Hopefully I'm not duplicating a question here, but I looked around and didn't see anything that addressed this specific issue.

I'm constructing some pages by creating a bunch of unique content blocks that I store in a folder - things like this:

h4 Content Example
p.description.
    Lorem ipsum dolor sample text etc etc

in, say, pages\contentBlocks\Example\contentExample.jade.

These content blocks are added to a mixin (pages\mixins.jade) that looks like this:

mixin contentBlock(title)
   .content-block(id=title.toLowerCase()) 
       h3 #{title}
       if block
           .content 
               block

and I call this mixin within a larger page (pages\portfolio.jade) like this:

.subsection
    //- Expects a list of objects of the format { title, html }
    each val in pageBlocks
        +contentBlock(val.title)
            != val.html

(the intention is to later enhance this with other variables that can be passed down into the mixin for in-place formatting, like background images)

I would like to make use of the ability of Express to automatically render all of the pages in a directory in a single call. Like so (index.js):

var pageBlocks = [];
res.render('pages/contentBlocks/Example/*', function (err, html) {
     if (err) throw err;
     pageBlocks.push({ html: html });
});

However, I'd also like to be able to reference the title of the file, for example for setting the class of the block that I put it in. Ideally, it would look something like this:

res.render('pages/contentBlocks/Example/*', function (err, html) {
     if (err) throw err;
     pageBlocks.push({ title:functionToGetFileName(), html: html });
});

Is there any way to do this without manually iterating through the files in that directory?

Or, since this method seems needlessly convoluted (given the presence of mixins, includes, extends, and partials, it feels like I ought to be able to do this without extra render calls), is there a better way to do this?


Edit: I've done a bit more looking around and code testing, and now I'm unsure. Can Express implicitly render all of the files in a directory? Based on this question, I assumed it could, but I might have misread. The formatting of res.render('path/to/directory/', callback) doesn't seem to be working - I get the following error:

Error: Failed to lookup view "path/to/directory/" in views directory "/path/to/app/views"
Foi útil?

Solução

For a temporary solution, I am using the following pattern:

exampleBlocks = [];
eb_dir = "pages/contentBlocks/Example";
fs.readdirSync("./views/" + eb_dir).forEach(function(file) {
    res.render(eb_dir + "/" + file, function (err, html) {
        if (err) throw err;
        exampleBlocks.push({title: file, html:html})
    });
});

Which is concise enough for my tastes, though calling res.render() so many times rustles my jimmies. I'd rather it be a single batch render, or better yet, solved through clever use of jade structures - but I still haven't thought of a way to do the latter.


Edit:

I decided I'd rather not simply enumerate the files in the folder - I want more control of the order. Instead of using an each loop in my page, I'm simply going to call the mixin with included content, like this (pages\portfolio.jade in my previous examples):

.subsection
    +contentBlock("Block 1")
            include blocks/block1
    +contentBlock("Block 2")
            include blocks/block2

I will leave the question here, however, as others may encounter a similar issue.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top