首页 > 解决方案 > 如何在 polymer3 的模板中嵌入 html 代码(如 unsafeHTML)

问题描述

请检查 plunker

static get template() {
   return html`
     <p>This content is from ChildClass.</p>
     <p>${super.template}</p>
     <p>Hello again from ChildClass.</p>
     <p style='color:red'>[[partHtml]] <==== this should be 'hello'</p>
     `;  
 }
 get partHtml()
 {
   return "<span>hello</span>";
 }

我想像partHtml普通 HTML 一样被注入到模板中。

我知道 lit-element 中的不安全 HTML 可以做到这一点,但是 lit-element 不能使用super.render()东西,它不像聚合物元素那样方便。

标签: javascriptpolymerpolymer-elementslit-elementlit-html

解决方案


如何使用inner-h-t-m-l属性

static get template() {
   return html`
     <p>This content is from ChildClass.</p>
     <p>${super.template}</p>
     <p>Hello again from ChildClass.</p>
     <p style='color:red' inner-h-t-m-l="[[partHtml]]"></p>
     `;  
 }
 get partHtml()
 {
   return "<span>hello</span>";
 }

推荐阅读