Javascript 将HTML标记从JSON字符串转换为真正的HTML元素

我创建了一个从JSON文件获取数据的自定义元素：

<polymer-element name="view-component" attributes="number">
<template>
    <link rel="stylesheet" href="custom_style.css" type="text/css">

    <core-ajax auto
    response="{{data}}"
    on-core-response="{{ajaxHandler}}"

    url="http://www.test.com/json/{{number}}"; 

    handleAs="json"></core-ajax>

    <div class="showbox">

    <p><b>entry:</b> {{data.entry| encodeEntities}}</p>
 </template>

我的控制台日志

console.log（div.childNodes[0]）显示一个看起来完美的DOM树！
但当我想将其返回到组件时，浏览器会呈现：
[object HTMLParagraphElement]
，而不是将DOM附加到我的元素

我错过了什么？感谢您的帮助
 出于安全考虑，聚合物默认情况下会泄漏注入的数据。（见附件）。因此，您必须使用
injectBoundHtml
方法。为此，您应该为
标记一个id，并使用
injectBoundHtml
添加内容，例如在
就绪
回调中：

Polymer({
  ready: function() {
    this.injectBoundHTML('<b>entry:</b> {{data.entry}}', 
                         this.$.your_paragraph_id);
  }
});

聚合物({
就绪：函数（）{
this.injectBoundHTML（'entry:{{data.entry}}}}'，
此.$。您的_段_id）；
}
});

两个旁白：

如果将脚本包含在

标记中，则无需在

Polymer（）

调用中指定元素的名称

我认为您缺少了

data

属性的声明，除非您将它放在publish对象或其他东西中

---

谢谢你的建议！不幸的是，我无法更改JSON输出！有没有其他（没有聚合物）方法来实现所需的行为？我不知道为什么您认为JSON模型必须改变才能工作（没有必要）。您需要做的唯一不同的事情是在创建自定义元素时使用injectBoundHTML。

Polymer({
  ready: function() {
    this.injectBoundHTML('<b>entry:</b> {{data.entry}}', 
                         this.$.your_paragraph_id);
  }
});