I have the following custom element.
<!--my-el.html--> <template> <br> template + slot <br> <template> <!-- <= inner template --> <slot></slot> </template> </template>
And, I am trying to use it as follows.
<my-el> <another-ce></another-ce> <my-el>
Now the problem is that the content from
another-ce is never projected in the
my-el. I need the inner template in
my-el to apply
show.bind (omitted from the example). However, regardless of the binding applied on the inner template, the content is never projected. The rendered DOM for the inner template looks as follows.
<template> #document-fragment <au-shadow-slot class="au-target" au-target-id="1"></au-shadow-slot> </template>
However, if I replace the inner template with something else (for example:
<element><slot></slot></element>), it works. I am interested about knowing why the former approach does not work here.