dart - 如何从外部 polymer 元素访问内部 polymer 元素

Question

我想定义一个新元素<my-table>，其中可以包含多个
列<mytable-col>用法应如下所示:

<my-table id="mt1">
 <mytable-col id="c1" title ="name" type="string"width="150"></mytable-col>
 <mytable-col id="c2" title ="age" type="number" width="60"></mytable-col>
</my-table>

是否可以用另一个(必需)新的“内部”定义一个元素
元件？
如何从外部的dart代码访问
内部元素实例。

如果 <my-table>和 <mytable-col>模板都包含标记，则
内部 <mytable-col>的标记被插入了吗？

Answer 1

标记<mytable-col>元素的编写方式是<my-table>的子级，这些子级已添加到<content>元素内的<my-table>节点中。

您可以从<mytable-col>的代码访问这些子元素，例如

var listContent = ($['content'] as ContentElement).getDistributedNodes();

我不确定你是什么意思

Is it possible to define an element with another (required) new "inner" element?

您可以在 enteredView()方法中添加代码(在 super.enteredView();调用之后，该命令验证正确的子节点在 <content>节点中是否可用，如果没有，则抛出异常。

where is the markup of the inner inserted?

标记被插入到其元素 shadowDOM中。
标记会更改元素的外观，但通常不可见，
例如，当您从浏览器中打开 view source时(除非您启用了在Chromium / Dartium中显示 shadowDOM的选项，或者您的浏览器不支持 shadowDOM，然后您会看到polyfills如何尝试模仿 shadowDOM)。

您可以将其与 <video>之类的标签进行比较，只需添加此标签即可创建许多元素(例如播放，停止，继续，快进按钮以及 <span>和 <div>)，这些元素会添加到幕后负责的位置用于 <video>标记的布局和行为，但在标记中不可见。