Feature request: add a second parameter for the template function (options object)

[vascanera]

Please consider adding a second parameter for the html (template) function. This would be useful for all kinds of initial options, like, for instance, action: append | prepend | replace | replaceInner | insertBefore | insertAfter | ... - where append is the (current) default action, but replaceInner would probably be a better fit for default action (as most libs/frameworks work this way).

Example code:

...(the html initial structure)
<div class="some-container">
    <span class="some-span">ABC</span>
</div>

... (the script)
html`<span class="some-span">XYZ</span>`(document.querySelector('.some-container'), { 
    action: 'replaceInner' // Replaces the innerHtml of .some-container with the resulting html code
});

...(should result in)
<div class="some-container">
    <span class="some-span">XYZ</span>
</div>

...(instead of)
<div class="some-container">
    <span class="some-span">ABC</span>
    <span class="some-span">XYZ</span>
</div>

Cheers!

[alpeshgit]

Result should contain XYZ not ABC.

[vascanera]

@alpeshgit, good catch. I updated the code. Thanks!

[justin-schroeder]

I'm not sure arrow should be responsible for this (really trying to keep package size down). However, there is no reason you cannot just call the arrow function and mount it yourself. For example:

Instead of:

html`<span class="some-span">XYZ</span>`(, { 
    action: 'prepend'
});

Just call the arrow function and do whatever DOM manipulation you prefer:

document.querySelector('.some-container').prepend(html`<span class="some-span">XYZ</span>`())

This works already and required no addition bloat 👍

[vascanera]

Yes, you are right. The minimalistic mantra of arrow finally 'clicked' for me. It makes perfect sense not to pollute the library with unnecessary stuff.