Question

在我的模板字符串中，我有一个p标签。如何使用变量设置其innerHTML？

让我们说

Let myVar = ”<b>Hello</b> there”;
<p id=”myPara”>${myVar}</p>

当我将myVar包装在p标记内时，html格式实际上不起作用

<p>${myVar}</p>

Answer 1

Actuall myVar具有”Hello World”。我希望文本支持HTML。

上面的重要信息。

这有点作弊，但是HTML中的所有元素都有一个innerHTML属性。

尝试

<p id=”myPara” inner-h-t-m-l="${myVar}"></p>

Answer 2

这与聚合物调制器官方仓库中的issue相同。在Polymer 2模板docs中，可能与此相关：

为防止XSS漏洞，Polymer.html仅插值HTMLTemplateElement值。非模板值将引发错误。

我不确定如何解决此问题，但是似乎您已经在尝试对innerHTML进行硬编码，为什么不继续使用属性绑定或仅使用硬编码的HTML这样呢？：

Hello there

在这种情况下使用变量的具体原因是什么？

Answer 3

使用appendchild将内容插入p标签。

<?xml version="1.0"?>
<opencv_storage>
<format>3</format>
<thresholdStep>10.</thresholdStep>
<minThreshold>50.</minThreshold>
<maxThreshold>120.</maxThreshold>
<minRepeatability>2</minRepeatability>
<minDistBetweenBlobs>20.</minDistBetweenBlobs>
<filterByColor>0</filterByColor>
<blobColor>0</blobColor>
<filterByArea>1</filterByArea>
<minArea>3000.</minArea>
<maxArea>10000.</maxArea>
<filterByCircularity>1</filterByCircularity>
<minCircularity>0.3</minCircularity>
<maxCircularity>1.0</maxCircularity>
<filterByInertia>1</filterByInertia>
<minInertiaRatio>0.3</minInertiaRatio>
<maxInertiaRatio>1.0</maxInertiaRatio>
<filterByConvexity>1</filterByConvexity>
<minConvexity>0.3</minConvexity>
<maxConvexity>1.0</maxConvexity>
</opencv_storage>

如何在Polymer 3中设置元素的innerHTML？

3 个答案: