Угловая виртуальная прокрутка с динамической переменной высотой / шириной?

Question

Я ищу угловой пакет виртуальной прокрутки со следующими функциями: 1) горизонтальная виртуальная прокрутка 2) ширина и высота контейнера изменчивы.3) Ширина элементов задается в процентах от ширины контейнера.4) Элементы могут быть свернуты во время рендеринга.

В настоящее время угловой cdk работает с фиксированным itemSize для высоты и ширины .... вот пример того, как он должен отображаться:

.parent {
  width: 100%;
  height: 100%;
  display: flex;
  padding: 10px;
}
.child {
  width: 33.333%;
  height: 100%;
}
.child.mini {
  width: 40px;
}

<div class="parent">
  <div class="child" *ngFor="let item of items" [class.mini]="item.isMini">
    <button (click)="item.isMini = !item.isMini">Minimize Me!</button>
    {{item.name}}
  </div>
</div>

Есть рекомендации?

Answer 1

Команда Angular работает над директивой autosize, которая позволяет выполнять прокрутку с различными размерами элементов.

Пример можно посмотреть, используя @angular/cdk-experimental здесь .
Сохранить вИмейте в виду, что это ЭКСПЕРИМЕНТАЛЬНО и в настоящее время не рекомендуется для производственного использования, но оно действительно дает вам ощущение, и если оно вам действительно нужно, это может помочь.

Также ознакомьтесь с проблемой github