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

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-second-element>触发的事件中访问<my-first-element>。事件处理程序中的querySelector()显然不起作用。

Answer 1

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

Answer 2

以下是您的代码示例：Plunk

选择完成于：

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

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