最后找到一个解决方案，需要使用包含你的Chart的变量。首先将您的轮盘设置为启用“假”。

@ViewChild('chart') canvas: ElementRef;
const ctx = this.canvas.nativeElement;
this.chart = new Chart(ctx,{
...
zoom: {
    zoom: {
         wheel: {
             enabled: false,
         },
         pinch: {
             enabled: true
         },
         mode: 'x',
     }
   }
})

然后在canvas div上创建一个mouseenter和mouseleave。

<div (mouseenter)="mouseEnter()" (mouseleave)="mouseLeave()">
  <canvas #chart></canvas>
</div>

要完成，请使用两个超时，一个是用户在1秒之前无法滚动到画布中，另一个是用户可以在1秒的延迟下退出和进入画布，并且仍然能够滚动。

zoomEnterTimeout: any
zoomLeaveTimeout: any

mouseEnter() {
    clearTimeout(this.zoomLeaveTimeout)
    this.zoomEnterTimeout = setTimeout(() => {
        this.infrastructureChart.options.plugins.zoom.zoom.wheel.enabled = true
        this.infrastructureChart.update()
    }, 1000)
}

mouseLeave() {
    clearTimeout(this.zoomEnterTimeout)
    this.zoomLeaveTimeout = setTimeout(() => {
        this.infrastructureChart.options.plugins.zoom.zoom.wheel.enabled = false
        this.infrastructureChart.update()
    }, 1000)
}