Wednesday, 15 April 2015

javascript - Jade Templates - Dynamically Calling a Mixin -



javascript - Jade Templates - Dynamically Calling a Mixin -

how can utilize string json beingness fed jade template dynamically load mixin? below, goal twocolumn.jade load foo , bar mixins.

twocolumn.jade

mixin twocolumns(obj) .container-fluid .row(class=obj.class) item in obj.items .col-xs-12.col-sm-3 //- syntax dynamically calling mixin? +item.template(item)

content.json

{ "twocolumns": { "class": "foobar", "items": [ { "template": "foo", "title": "hello" }, { "template": "bar", "title": "world" } ] } }

this feature not obvious in jade, not explicitly mentioned in documentation. can utilize interpolation syntax (#{...}) dynamically choosing mixin name.

from jade language guide:

interpolation? yup! both types of text can utilize interpolation, if passed { name: 'tj', email: 'tj@vision-media.ca' } compiled function can following:

#user #{name} <#{email}>

outputs <div id="user">tj &lt;tj@vision-media.ca&gt;</div>

example usage:

mixin foo(item) p foo called mixin bar(item) p bar called mixin twocolumns(obj) .container-fluid .row(class=obj.class) item in obj.items .col-xs-12.col-sm-3 +#{item.template}(item)

javascript node.js templates jade

No comments:

Post a Comment