web-dev-qa-db-fra.com

Utiliser une variable dans un include Jade

Je travaille avec Jade et Express et je voudrais utiliser une variable dans mon instruction include. Par exemple:

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

Lorsque je fais cela, j'obtiens l'erreur EBADF, Bad file descriptor 'templates.jade'

J'ai même essayé

include #{templates}

en vain.

node.jsexpresspug
51
Spencer Carnage

AFAIK JADE ne prend pas en charge l'inclusion dynamique. Ce que je suggère, c'est "d'inclure" en dehors du modèle, c'est-à-dire.

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 }
42
freakish

cela fonctionne aussi:

//controller
var jade = require('jade');
res.render('show', {templateRender: jade.renderFile});


//template
!= templateRender('my/path/'+dynamic+'.jade', options)

Cela n'augmentera probablement pas les performances que vous attendez de l'utilisation du paramètre 'view cache' (il est activé par défaut dans NODE_ENV === 'production'). Ou même casser l'application (par exemple si les fichiers ne sont pas disponibles sur le disque dur lors du déploiement du nouveau code). Essayer également d'utiliser cette astuce dans une application côté client ou isomorphe ne fonctionnera pas car le modèle ne peut pas être compilé.

19
antpaw

J'ai trouvé cette page googler pour la même question, mais dans un contexte différent, alors j'ai pensé mettre ma solution (lire: solution de contournement) ici pour la postérité:

Je voulais entourer mon inclusion avec plus de contexte extrait de la variable, par exemple (simplifié):

- 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

Comme cela ne fonctionne pas (Jade ne prend pas en charge les inclusions dynamiques, comme indiqué par freakish), j'ai hybridé avec un mixin:

(Edit– un peu plus élégant que ma solution de contournement précédente :)

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

Ma réponse précédente:

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/

...

Ce n'est pas élégant et cela ne fonctionnera pas si vous devez inclure plus de quelques éléments de cette façon, mais au moins une partie du Jade est dynamique.

7
Frijol

Pourquoi ne pas utiliser l'héritage de jade?

Rendez ce que vous voulez au niveau du middleware:

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

Ecrire commun common.jade:

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

Ensuite, écrivez un fichier qui étend common.jade:

extends common.jade
block sublevel
  h2 Some things are here
1
user2956171

Nous sommes en 2019 et l'utilisation de variables dans les mixins Pug (anciennement Jade) est devenue simple.

Lors de la création de votre mixage, vous pouvez lui donner des paramètres selon la ou les valeurs que vous prévoyez de transmettre au mixage. Vous pouvez accéder à toutes les valeurs imbriquées à l'aide de la notation par points.

mixinFile.pug:

mixin myMixin(parameter1, parameter2, parameter3)
    h2.MyHeading #{parameter1}
    p.MyParagraph #{parameter2.myVariable}
    .MyBox(id= parameter3.id)

index.pug:

include mixinFile
block content
    +MyMixin(variable1, variable2, variable3)

Vous pouvez en lire plus dans la documentation officielle de Pug sur Mixins .

0
robertunyx