如何在Angular中注册触摸移动事件？

总结问题

闪电战-

我正在尝试注册触摸事件，希望能够触摸我的手指，拖动并抬起我的手指，从而使触摸到的桌子的每个

td

都高亮显示。这似乎被记录为

pan

事件

当任何事件

点击、触摸等
注册时，我使用了一个字典
按下
，
[class.bg warning]=“按下[I]”
来突出显示这些事件

是否有办法注册每个
td
td

我尝试过类似于
单击、touchstart
和
hammerjs
事件（在
app.module.ts
中，我已通过
import'hammerjs'；
导入），但我必须单击每个
td
以突出显示它

<td *ngFor="let dummy of ' '.repeat(48).split(''), let i = index"
    (press)="logPress(i)"
    (mouseenter)="logMouseIn(i)"
    (touchmove)="logTouchmove(i)"
    (click)="logClick(i)"
    (touch)="logTouch(i)"
    (touchend)="logTouchend(i)"
    (hover)="logHover(i)"
    (touchstart)="logTouchstart(i)"
    (touchend)="logTouchend(i)"
    (touchcancel)="logTouchcancel(i)"
    [class.bg-warning]="pressed[i]" >
</td>

堆栈闪电战-

需要更改-这里的关键是如果我

(pan)="logPan(i)"

在
td
内，则无论pan事件记录的
i
与pan开始的位置相同

如果我这样做

(pan)="logPan($event)"

我可以通过
evt.center.x/evt.center.y
访问
$event
坐标
（x，y）

利用坐标-将坐标
（x，y）
转换为我关心的
td
我使用了一种方法，该方法返回指定坐标（相对于视口）处最顶部的元素我还为每个
td
添加了一个可访问的属性
id
，这样我就可以设置我的
按下的
字典，它将
td
记录下来

logPan(evt: any) {
  this.event += '\n Touch Pan: '+ `(${evt.center.x}, ${evt.center.y}, ${document.elementFromPoint(evt.center.x, evt.center.y).id})`
  this.pressed[document.elementFromPoint(evt.center.x, evt.center.y).id]=1;
}

附加的-pan似乎无法拾取手指第一次启动的位置，因此需要一个附加的
（touchstart）=“logTouchstart（i）”

信贷-我在下面的博客上看了Stackblitz后发现了这一点：
evt.center.x和evt.center.y确实帮助了我。有用的回答：）
logPan(evt: any) {
  this.event += '\n Touch Pan: '+ `(${evt.center.x}, ${evt.center.y}, ${document.elementFromPoint(evt.center.x, evt.center.y).id})`
  this.pressed[document.elementFromPoint(evt.center.x, evt.center.y).id]=1;
}