posthtml-modules
posthtml-modules copied to clipboard
Passing data to modules
Would be really useful if we could somehow pass data other than a JSON string to a module.
For example, imagine using a loop with posthtml-expressions:
<each loop="item, key in [1, 2, 3]">
<module href="test.html">
{{ item }}
</module>
</each>
or maybe somehow pass item as a local:
<each loop="item, key in items">
<module href="test.html" locals='{"item": item}'></module>
</each>
I can't figure out how to provide item to the module, so that it evaluates it and renders the correct value.
@Scrum any ideas?
@Scrum now that we have attributes as locals, would it be possible to evaluate them with expressions so that a user could do something like this?
parent.html
<each loop="item, key in [1, 2, 3]">
<component
src="example.html"
item="{{ item }}"
></component>
</each>
example.html
{{ item }}
Result
1
2
3
Hmm so actually, it does work.
The problem I had was with an array of objects, and that can be done like this:
const items = [
{
title: 'lorem',
},
{
title: 'lorem ipsum',
},
]
parent.html
<each loop="item, key in items">
<component
src="example.html"
item="{{ item }}"
></component>
</each>
example.html
{{{ JSON.parse(item).title }}}
Result
lorem
lorem ipsum