如何访问迭代模板中的任何元素

Question

考虑以下聚合物元素。

<polymer-element name="some-element">
  <template>
    <div layout vertical center>
      <template repeat="{{item in array}}">
        <my-first-element on-some-event="{{handleEvent}}"></my-first-element>
        <my-second-element></my-second-element>
      </template>
    </div>
  </template>

  <script>
  Polymer('some-element', {
    handleEvent: function(event, detail, sender) {
      var second_element = sender.templateInstance.model.querySelector('my-second-element');
    }
  });
  </script>
</polymer-element>

我需要在同一模板实例中由 <my-first-element> 触发的事件访问 <my-second-element>。事件处理程序中的querySelector()显然不起作用。

Answer 1

sender 是一个 DOM 元素，因此您可以使用例如 sender.nextElementSibling 来获取下一个节点。

Answer 2

这是您的代码的实际示例：Plunk

选择由以下人员完成：

var second_element = this.shadowRoot.querySelector('#second_element');

有关自动节点查找的更多说明 here。

如何访问迭代模板中的任何元素

How to access any element within iterative templates

javascript

polymer