У меня есть программа просмотра документов, которая показывает все страницы внутри документа. У меня также есть панель инструментов, которую я отображаю в соответствии с положением щелчка мыши после вычисления смещения. Теперь я реализовал виртуальную прокрутку материала, которая лениво загружает страницы документа в соответствии с положением прокрутки.
Проблема в том, что расчет для позиции «y», который я использовал до реализации Virtual Scroll, работает только до тех пор, пока первое изменение отображаемых элементов внутри области просмотра Virtual Scroll.
Когда следующие элементы отображаются в представлении, вычисление, выполненное с помощью метода ниже для позиции «y», неверно.
Любая помощь в решении этой проблемы будет принята с благодарностью.
Это метод расчета, который я использовал:
@Input() documentViewPort: CdkVirtualScrollViewport;
private calculateRelativeToDocumentMousePosition(mouseEvent: MouseEvent): void {
const parentElement = this.documentViewPort.elementRef.nativeElement;
const parentPosition = parentElement.getBoundingClientRect();
this.relativeToDocContainerMouse.coordinateX = mouseEvent.clientX + parentElement.scrollLeft - parentPosition.left;
this.relativeToDocContainerMouse.coordinateY = mouseEvent.clientY + parentElement.scrollTop - parentPosition.top;
}
Структура HTML выглядит так:
<cdk-virtual-scroll-viewport>
<div *cdkVirtualFor="let page of pages; let i = index" class="single-page">
<app-document-single-page>
</app-document-single-page>
</div>
<app-toolbar
[documentViewPort]="viewPort"
></app-toolbar>
</cdk-virtual-scroll-viewport>