点击聚合物铁列表项目的听众？

Question

我有一个自定义元素,iron-list用于显示一个对象数组.每个项目都通过模板生成,如下所示:

<iron-list id="projectList" items="[[projects]]" indexAs="_id" as="projLI" class="layout flex">
    <template>
        <div>
           <paper-material id="itemShadow" animated elevation="1">
               <div class="item layout horizontal" onmouseover="hoverOver(this)" onmouseout="hoverOut(this)">

                   <!-- I use a paper-menu-button to display a list of available actions here -->

                   <!-- list item object content here such as: [[projLI.desc]] etc. -->

               </div>
           </paper-material>
        </div>
    </template>
</iron-list>

什么是最好的聚合物友好方法来检测铁列表项目本身的点击事件(理想情况下知道哪个项目实际上是通过点击projLI._id),还能够以paper-menu-button不同的方式处理内部点击事件？

我是一个眼球聚合物1.0的新事件听众(https://www.polymer-project.org/1.0/docs/devguide/events.html),作为一种可能的方法,试图听取不同的元素点击事件(如该页面上的示例1所示),但我不确定这是否可行.我还考虑过以iron-selector某种方式使用铁列表吗？那可行吗？我不确定它是否会起作用,因为铁选择器只有一个孩子(即铁列表元素,而不是它的模板儿童).

我觉得我错过了一个非常简单的方法来实现这一目标.有人可以给我看灯吗？

Answer 1

按照本演示的第154和184行概述的模型. https://github.com/PolymerElements/iron-list/blob/master/demo/collapse.html

我-element.html

<iron-list items="[[items]]">
  <template>
    <my-list-item on-tap="_toggleMe"></my-list-item>
  </template>
</iron-list>
...
_toggleMe: function(e) {
  console.log(e.model.index);
}

关键是将事件和监听器方法(toggleMe()在本例中)置于<template>其中iron-list.这允许iron-list注册数组索引.