[英]How to render html tag inside Template literals (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 标签,而是在网站中显示为字符串。
我自己找到了解决方案:
import {unsafeHTML} from 'lit-html/directives/unsafe-html.js';
const foo = '<' + fooNrX + '></' + fooNrX + '>';
render(
html `${unsafeHTML(foo)}`,
document.querySelector('#bigfoo')
);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.