Как отобразить HTML-тег внутри шаблонных литералов (LitElement)?

Мне нужны литералы шаблонов с foo-nr1, foo-nr2 ... и использовать их как тег HTML.

render(
        html `<foo-nrX></foo-nrX>`,
        document.querySelector('#bigfoo')
      );

Поскольку X является заполнителем, я пробовал все вот так:

        html `<${fooplaceholder}></${fooplaceholder}>`,

или это из аналогичного q / a здесь:

const getHTML = message => unescape(message).replace('\\', '');
const setHTML = escape('<' + foo-nrX + '></' + foo-nrX + '>');

        html `${getHTML(setHTML)}`,

Однако наилучшие результаты: "<foo-nrX></foo-nrX>"

вместо: <foo-nrX></foo-nrX>

Поэтому он не анализирует его как HTML-тег, вместо этого он отображается на веб-сайте как String.


javascript html lit-element template-literals
person Community    schedule 07.11.2020    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Я нашел решение самостоятельно:

import {unsafeHTML} from 'lit-html/directives/unsafe-html.js';

const foo = '<' + fooNrX + '></' + fooNrX + '>';

render(
        html `${unsafeHTML(foo)}`,
        document.querySelector('#bigfoo')
      );
person Community    schedule 07.11.2020