dynamic custom tag names

[yomed]

I would like to determine which custom tags get called via my renderer.js

So in the renderer, something like this:
data.details=['d1','d2','d3']

And then in template.marko (which doesn't work):
<for each="detail in data.details">
    <${detail} />
</for>

One solution would be to explicitly call out tags conditionally:
<for each="detail in data.details">
    <if test="detail==='d1'">
        <d1 />
    </if>
</for>

But is there any other way to accomplish this?

[patrick-steele-idem]

Hi @yomed, instead of a custom tag (which is associated with a renderer function) you can invoke a renderer(input, out) function directly:

data.renderers=[
    require('../foo'),
    require('../bar'),
    require('../baz')
]

<for each="renderer in data.renderers">
    <invoke function="renderer(myInputObject, out)"/>
</for>

I don't know exactly how that fits into your app, but hopefully you get the idea. FYI, a custom tag is resolved to a renderer at compile-time.

Please let me know if that doesn't solve your problem.

[yomed]

Thanks Patrick, that seems to work well. Do you know how I might include w-id in this case?

So that

<detail w-id="detail[]" />

would become something like this...

<invoke function="renderer(data, out)" w-id="detail[]" />

[patrick-steele-idem]

Assigning a w-id attribute to an <invoke> tag currently doesn't work because of how the compile-time transform is implemented for marko-widgets. I'll look into seeing if it can be supported with a small code change. Can you please open a Github issue against the marko-widgets project?

[yomed]

Ok thanks. That would be great if this could be supported.

[patrick-steele-idem]

marko-widgets was updated to support the w-id attribute with the <invoke> tag: marko-js-archive/marko-widgets#46

Closing this issue.