使用Polymer.dart从动态添加的自定义元素内部操纵阴影DOM

这个应用程序有一个“浏览器”，可以保存“轨迹”。浏览器需要能够在其轨迹上调用

render

。当轨迹渲染时，它会向其阴影DOM添加一个新的

节点

目前，

render

被调用，ParagraphElement被创建，父级“div#insert here”被顺利找到，但是将新创建的ParagraphElement添加到div的子级不会在浏览器中呈现

如果我们在enteredView期间更改代码以将新的

插入ExampleBrowser的阴影dom，则

将按预期显示在浏览器中。为什么它适用于顶级自定义元素，而不适用于动态创建的自定义元素

bugTest.dart

import'包装：polymer/polymer.dart'；
导入“dart:html”；
@CustomTag（'example-browser'）
类ExampleBrowser扩展了聚合关系{
@出版的范例跟踪；
ExampleBrowser.created（）：super.created（）；
@凌驾
无效输入视图（）{
track=new Element.tag（'example-track'）
..trackName=“测试轨道”；
}
void renderTrack（MouseEvent e）{
track.render（）；
}
}
@CustomTag（'example-track'）
类ExampleTrack扩展了聚合关系{
@已发布的字符串trackName；
ExampleTrack.created（）：super.created（）；
void render（）{
ParagraphElement TestParagage=新的ParagraphElement（）
…text=“我似乎没有被添加到DOM:（”；
$['insert-here'].children.add（测试段落）；
}
}

自定义元素.html

浏览器
渲染轨迹
{{trackName}}

index.html

错误测试
出口“包装：聚合物/初始省道”；
错误测试

我认为重复一系列元素是行不通的

只应在模型数据上重复

您的代码所做的是

您的

曲目

列表的内容被完全忽略（除了条目数之外），因为您在标记中没有引用它。如果您使用

@observable list tracks=[1,2,3,4,5]；

您应该在

ExampleTrack

的

attached（）

中调用

render（）

通过这种方式，您可以从

曲目

列表中获取数据，并将其添加到所创建的

示例曲目

如果要在生成的

ExampleTrack

s中触发更新，请更改绑定的模型值（

tracks[0]。aField='someNewValue'；

），并让

ExampleTrack

在

void someattributeChanged（old）{/*do something*/}中执行某些操作

您必须注意，

跟踪

，其中的元素及其字段是可观察的。

---

搜索

[dart]observable

打开，因此应该有足够的示例。

感谢甘特的快速响应。在实际应用中，重复模板中实例化的元素具有从每个曲目实例中提取的属性。我还希望能够根据需要重新渲染曲目。无论是否使用单个instance。我对问题进行了编辑，以使这些观点更清晰。我更新了我的答案。你应该重新考虑你的方法，这不是聚合物的工作原理。请注意。添加无效属性更改（旧）{无论什么}是一种更好的方式来完成我想要的。谢谢居里！看来你明白了！玩得开心！