Как вернуться к той же части набора данных при виртуальной прокрутке?

Question

Существует замечательная схема оптимизации рендеринга больших наборов данных, называемая виртуальной прокруткой. В этом конкретном случае я использую Angular Material CDK API https://material.angular.io/cdk/scrolling/overview, чтобы получить такое поведение. Однако у меня есть требование, когда пользователь переходит на другую страницу и возвращается, пользователь должен находиться в том конкретном месте, которое он оставил (например, перейти к деталям элемента 3498, а когда он возвращается, он должен начинаться с пункта 3498, а не пункта 1). Каков наилучший способ добиться этого?

Answer 1

Вы можете добавить CdkVirtualScrollViewport дочерний вид:

@ViewChild(CdkVirtualScrollViewport) virtualScroll: CdkVirtualScrollViewport;

, затем вы можете играть такими способами, как this.getOffsetToRenderedContentStart() и this.setRenderedContentOffset(), чтобы сохранить и восстановить исходное местоположение прокрутки.

Вы можете, например, сохранить эту информацию внутри службы или локального хранилища.

Answer 2

Реализовано то, что предложил Франческо Борци, и оно отлично работает. вот реализация стекаблица .Большая часть действия происходит в файле примера cdk-virtual-scroll-Overview-example.