例如,我有一个dom-repeat:
<template is="dom-repeat" id="rows" items="[[rows]]" as="row">
<tr class="result-tb-row" closed$=[[row.closed]]>
<td class="result-tb-data">
<ul class="violation-list">
<template id="rowItem" is="dom-repeat" items="[[row.items]]">
<li on-click="click">[[item]]</li>
</template>
<ul>
</td>
</tr>
</template>
如果我想知道我点击的是哪一行,我可以这样写:
this.$.rows.itemForElement(event.target);
但是,如果我想获得与我点击的li
对应的确切项目该怎么办?我该怎么做呢?我显然不能做this.$.rowItem.itemForElement(event.target)
,因为rowItem
不是唯一的。
event.model.item
似乎解决了这个特殊的问题。但是,如果您有双嵌套dom-repeat或更多,并且您想要获得中间层,那么您就不走运了。可能需要自己实现一个迭代器。双嵌套dom-repeat在表中经常发生。表已经是一个嵌套dom-repeat;如果您希望在表单元格中使用dom-repeat(您将会遇到这种情况),则会出现双嵌套dom-repeat。
实现迭代器并不难,只希望Polymer团队支持嵌套dom-repeat的更多方法,因为这是一个很棒的特性。
event.target
保存了<li>
的引用。
当您执行this.$.rowItem.itemForElement(event.target)
时,名为rowItem
的dom-repeat
是唯一的,并且它将查看属于该<li>
的项目。
但是如果您只想要项目数据,您可以使用event.model.item
,它包含对属于您单击的行的项目数据的引用。
这是一个完全有效的问题,我也面临着同样的情况。有人有解决办法吗?
我在e.model.__data__
中找到了ID。但这感觉像一个hack
在这里。我用了几个应用程序才弄明白。
Polymer认为内部ID是动态创建的ID。因此,使用Polymer对动态id 的自动节点查找,您可以说:
this.$$('#rowItem').itemForElement(event.target)
如下所示:https://www.polymer-project.org/1.0/docs/devguide/local-dom.html node-finding