AureliaJS 中 ul 项目的 click.delegate

Mar*_* M. 2 html javascript event-delegation aurelia

给定ul列表定义如下:

<ul click.delegate="onListItemClick()">
    <li repeat.for="suggestion of suggestions">
        ${suggestion.name}
    </li>
</ul>
Run Code Online (Sandbox Code Playgroud)

如何将建议对象传递给 onListItemClick?我知道我可以放置click.delegate每个单独的li元素然后捕获当前,suggestion但这不会违背事件委托的想法吗?我的意思是 - 那么我将附加多个事件处理程序,如果是这样,我可以使用click.trigger. 我不想这样做,因为可能有很多这样的suggestion对象。

Ash*_*ant 5

将点击处理程序放在li元素上。这就是 Aurelia 事件委托的全部意义所在。它允许你做这样的事情,而无需创建一堆事件处理程序的开销。框架仅为您创建了一个事件处理程序。它委托调用。所有元素的单击事件都将设置为相同的函数,Aurelia 将处理调用您的 VM 方法。

这里有一个gist.run:https://gist.run/?id=406bf3bc73e415db7afa7d46d7e958d3

<template>
  You clicked suggestion id "${clickedId}"
  <ul>
    <li repeat.for="suggestion of suggestions" click.delegate="handleClick(suggestion)">
      ${suggestion.name}
    </li>
  </ul>
</template>
Run Code Online (Sandbox Code Playgroud)