Angular cdk-virtual-scroll-viewport 鼠标滚动仅在水平方向上无法使用鼠标滚轮工作

Question

有什么方法可以激活cdk-virtual-scroll-viewport水平方向的鼠标滚动吗？

正如我们在角度材料的示例中看到的那样，您只能通过从滚动条拖动来滚动，但不能仅使用鼠标滚轮进行滚动。

https://material.angular.io/cdk/scrolling/overview

我的目的是拥有一个像 Netflix 一样带有图像的组件，并且只需使用鼠标滚轮即可滚动它们。

第二个问题是：有人有这方面的例子吗？

我想实现这样的目标：

https://codepen.io/CalvinMorett/post/incorporate-horizo​​ntal-scrolling-mousewheel

Answer 1

今天遇到了同样的问题，在网上找不到任何东西。这是我发现的以及对我有用的内容：

https://www.damirscorner.com/blog/posts/20211022-MouseWheelScrollingInAngular.html

本指南并非特定于 cdk，但也可以与 cdk 一起使用。

基本上，创建一个新指令，侦听鼠标滚动事件，然后按鼠标增量偏移元素的位置。