聚合物如何重新渲染元素/模板

Question

我试图动态地向iron-pages添加一个页面，但是元素不识别动态添加的内容。我认为在html呈现过程中会发生这种情况，但我不知道如何再次触发它。下面的jsbin演示了我要做的事情：http://jsbin.com/nuhone/4/edit?html,console,output。基本上，我有一个有一个现有页面的iron-pages。我试图动态地添加第二个页面，但由于iron-pages不识别新添加的div，所以无法添加第二个页面。

Answer 1

看看你的代码--基本上有两个问题。

1. Polymer.domAPI 插入或移除节点时，请使用它。
2. 种族条件 iron-pages扩展了IronSelectableBehavior - ie MutationObservers已经被很好地设置好，以便在您添加/删除页面时检测到。然而，这需要时间来触发。用Polymer.async()包装您的下一步，将它们放在微任务队列的末尾。 document.addEventListener("WebComponentsReady"，函数() { var newDiv = document.createElement("div")；newDiv.innerHTML = "Def"；var ironPage =document.querySelector(“铁页”)；Polymer.dom(ironPage).appendChild(newDiv)；Polymer.Base.async(函数(){ console.log(ironPage.items.length)；//显示2 ironPage.select(1)；}；})；

您的jsbin固定：http://jsbin.com/viqunoxesi/edit?html,console,output

Answer 2

它可能有助于使用类似的聚合物DOM API

Polymer.dom(document.querySelector("iron-pages"))
  .appendChild(newDiv);