Javascript 具有动态可变高度/宽度的角度虚拟滚动？

我正在寻找具有以下功能的angular virtual scroll软件包： 1） 水平虚拟卷轴 2） 容器的宽度和高度是流动的。 3） 项目宽度设置为容器宽度的百分比。 4） 可以在渲染期间最小化项目

角度cdk当前使用固定的高度和宽度itemSize。。。。 下面是一个如何渲染的示例：

.parent{
宽度：100%；
身高：100%；
显示器：flex；
填充：10px；
}
.孩子{
宽度：33.333%；
身高：100%；
}
.child.mini{
宽度：40px；
}

最小化我！
{{item.name}

Angular团队正在研究一个

autosize

指令，该指令允许滚动不同大小的项目

您可以使用

@angular/cdk-experiative

请记住，这是实验性的，目前不建议在生产中使用，但它确实会给你感觉，如果你真的需要它，它可能会有所帮助

此外，请查看您可以尝试的

。说到你的需求，它支持你

• ,
• ,

---

不确定基本尺寸，我想你必须重新考虑一下应用程序中的模板。模板和数据流。。。希望这有助于ag virtual scroll组件支持不同行高的虚拟滚动，但滚动只能垂直工作

NPM：

---

演示页面：（第二个示例）

如果您不想像前面提到的那样自动调整指令的大小

以下是另一种方法：

我已通过动态传递高度值解决了此问题：

<cdk-virtual-scroll-viewport #scrollViewport 
[itemSize]="itemSize" [style.height.px]="viewPortHeight">
</cdk-virtual-scroll-viewport>

注意：我的视口组件放在一个

中

---

itemSize

和

viewPortHeight

是上下文中定义的变量。

有解决方案吗？我也有同样的“问题”最终使用了ngx scroller。它唯一不支持的是ltr。你是说rtl吗？当列表是垂直的时候，它有什么影响吗？我是说rtl。我认为这不应该影响垂直列表