À l'aide de Jade, comment puis-je déclarer un corps de classe dans une étendue de modèle?

L'aide du modèle Jade moteur, je veux pouvoir éventuellement déclarer des classes de balises de corps, dans les modèles qui s'étend de l'autre.

mise en page.jade

!!! 5
html(lang='en')
head
    block title
    meta(charset='utf-8')
    link(rel='stylesheet', href='/stylesheets/style.css')
    block addhead

block body
    div#wrap
        header
            div#header_content
                p
                    a(href='/')
                        img(src='/images/logo.png', alt='Template-e-o')
            div.hr.red
        br(style='clear:both;')

        div#content
            block content
            br(style='clear:both;')

index.jade

extends layout

block title
    title bidi

block body
    body.index

block content
    p ’ello govna.

Ce n'est pas de travail.

Vous pouvez publier qu'un code plus complet exemple de ce que vous avez essayé et n'ont pas de travail? Utilisez-vous un "s'étend de mise en page" déclaration dans votre index.jade? Elle permettrait de voir l'ensemble .jade fichiers. Et juste d'une "syntaxe de sucre" astuce, vous pouvez utiliser le corps.index au lieu de (classe='index').
Oui, merci. Est-ce mieux? Le modèle est l'héritage de travail, c'est juste comment éventuellement donner la balise body de la classe, que j'essaie de comprendre.

OriginalL'auteur Frode | 2012-02-09

  1. 4

    Ok, le block body déclaration est juste un bloc avec le nom de corps, de sorte que la mise en page vous n'avez pas de body tag inclus, il doit être ajouté à l'index.jade (que vous essayez de le faire). Cependant, dans votre index.jade, vous remplacer le bloc de contenu avec seulement corps.index (qui, je suppose, puisque je ne suis pas sur mon dev ordinateur et ne peut pas l'essayer dès maintenant - rend OK mais prend tout le contenu, vous vous retrouvez avec seulement un vide de corps, mais il faut avoir la classe='index' attribut).

    Ce que vous pourriez faire est d'essayer ceci (dans l'index.jade):

    block prepend body
    body.index

    Mais je ne sais pas si le reste de votre mise en page.jade (div#wrap) va afficher correctement sous le corps (j'en doute).

    Ce que je recommanderais, si c'est vraiment juste une question de l'ajout d'une condition de la classe sur le corps, est quelque chose de ce genre dans la mise en page.jade (au lieu de bloquer le corps):

    body(class=myClassLocalVar)

    Où myClassLocalVar est spécifié dans votre .le rendu de l'appel (res.render('index', {myClassLocalVar: 'theClass'});). myClassLocalVar peut même être un tableau, et jade va affecter toutes les classes dans le tableau de votre corps.

    Vous avez raison, à l'aide de “bloc de préfixer le corps ... le corps.l'indice”, le contenu du corps n'est pas le rendu de la façon dont je le veux, mais votre solution ne. Merci beaucoup!

    OriginalL'auteur

  2. 36

    Jade prend en charge ruby comme la chaîne de l'interprétation

    Dans votre mise en page 

    - var bodyClass = '';
block vars
body(class='#{bodyClass}')
  block content

    Dans votre afficher les fichiers

    extends layout
block vars
  - var bodyClass = 'my-page';
block content
  p Hello World!
    Celui-ci fonctionne très bien si vous êtes le rendu des fichiers statiques à partir de la ligne de commande (par ex. avec Grunt) et ne peuvent pas facilement passer dans les variables dynamiquement.
    Pourquoi ne pas vous mettre la - var bodyClass à l'intérieur de la block vars dans le premier bit, par intérêt?
    De mon côté, j'ai dû définir bodyClass comme body(class=bodyClass) pour le faire fonctionner.

    OriginalL'auteur

  3. 6

    Vous pouvez manipuler des variables dans la portée parent, de sorte que cette solution est également possible:

    Dans votre mise en page 

    - var bodyClasses = [];
block beforeBody

body(class=bodyClasses)
  block content

    Dans votre afficher les fichiers

    extends layout
block beforeBody
  - bodyClasses.push('my-page')
block content
  p Hello World!

    Faire vous permet d'ajouter plusieurs classes de différents niveaux de votre mise en page.

    OriginalL'auteur