如何访问通过Polymer定义的自定义元素的内部元素

时间:2015-01-09 16:09:45

标签: dart polymer

我正在使用Dart在Polymer中创建自定义元素。我想从标签内部获取一些内容,如下所示:

<my-element>
  <name>doof</name>
</my-element>

在用于处理my-element元素的dart代码中,我发现很难找到“name”元素的内容。下面的代码说明了我做过的一些尝试:

@CustomTag('my-element')
    class MyElement extends PolymerElement {

     MyElement.created() : super.created() {

           // Will always find the first element in the document. That quickly
           // gets confusing when I have multiple instances of  <my-element> in the
           // document.
           final Element nameElement = querySelector("name");

           // Returns null
           final Element nameElement = shadowRoot.querySelector("name");
     }
}

...所以我很困惑:-)有没有人有任何想法?

2 个答案:

答案 0 :(得分:1)

首先,除了可能的局部变量初始化之外,单独留下created构造函数 改为覆盖attachedready等生命周期回调。 querySelector("name");应该可以工作。如果您获得了文档中的第一个元素,那么您应该使用this.querySelector("name");(取决于您的导入)shadowRoot.querySelector("name");用于<template>的{​​{1}}标记内的元素,而不是孩子(就像你的问题一样)。

<my-element>

答案 1 :(得分:0)

this.shadowRoot.querySelector()将扫描当前&#39; my-element&#39;中的dom。标签

<my-element>
  <div id="myName">doof</div>
<my-element>

this.shadowRoot.querySelector(&#34; #myName&#34;)将返回DivElement