Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Pass variables to base layout from extending pug/jade template

I would like to set a class on the body tag by declaring a variable in a template that extends a base layout.

When I try, the body_class variable is undefined in the layout.

It appears the layout is executed before the extending template, or they are executed in different scopes or something.

Is there another way? Would a mixin work here?

_layout.jade:

doctype html html(lang="en-au")     head         meta(charset="utf-8")         block css     body(class=(body_class || "it-did-not-work"))         block header         block content         block footer 

home.jade:

var body_class = 'i-am-the-home-page' extends _layout block header     h1 home 
like image 691
Mike Causer Avatar asked Mar 17 '15 01:03

Mike Causer


People also ask

How do you use Pug extends?

To extend this layout, create a new file and use the extends directive with a path to the parent template. (If no file extension is given, . pug is automatically appended to the file name.) Then, define one or more blocks to override the parent block content.

What is pug template?

About PUG. pug. js, also known as PUG, is a Javascript library that was previously known as JADE. It is an easy-to-code template engine used to code HTML in a more readable fashion. One upside to PUG is that it equips developers to code reusable HTML documents by pulling data dynamically from the API.


1 Answers

Ah ha! Figured it out.

Create a block at the top of the base layout and add your variables in there.

_layout.jade:

block variables doctype html html(lang="en-au")     head         meta(charset="utf-8")         block css     body(class=(body_class || "it-did-not-work"))         block header         block content         block footer 

home.jade:

extends _layout block variables     - var body_class = 'i-am-the-home-page' block header     h1 home 
like image 62
Mike Causer Avatar answered Sep 22 '22 02:09

Mike Causer