본문으로 건너뛰기

Angular Virtual

@tanstack/angular-virtual 어댑터는 핵심 가상화 로직을 감싸는 래퍼입니다.

Angular Virtual은 Angular 19 이상을 지원합니다. 실제로 이 어댑터는 Angular LTS 릴리스와 그 이후 버전을 지원하도록 설계되었습니다.

injectVirtualizer

function injectVirtualizer<TScrollElement, TItemElement = unknown>(
options: PartialKeys<
Omit<VirtualizerOptions<TScrollElement, TItemElement>, 'getScrollElement'>,
'observeElementRect' | 'observeElementOffset' | 'scrollToFn'
> & { scrollElement: ElementRef<TScrollElement> | TScrollElement | undefined },
): AngularVirtualizer<TScrollElement, TItemElement>

이 함수는 HTML 요소를 scrollElement로 사용하도록 구성된 AngularVirtualizer 인스턴스를 반환합니다. 반환된 AngularVirtualizer는 핵심 Virtualizer를 그대로 반영하지만, 어댑터가 관리하는 상태는 Angular 시그널을 통해 노출됩니다. 여기에는 다음 항목이 포함됩니다.

  • getTotalSize
  • getVirtualItems
  • isScrolling
  • options
  • range
  • scrollDirection
  • scrollElement
  • scrollOffset
  • scrollRect
  • measurementsCache

injectWindowVirtualizer

function injectWindowVirtualizer<TItemElement = unknown>(
options: PartialKeys<
VirtualizerOptions<Window, TItemElement>,
| 'getScrollElement'
| 'observeElementRect'
| 'observeElementOffset'
| 'scrollToFn'
>,
): AngularVirtualizer<Window, TItemElement>

이 함수는 window를 scrollElement로 사용하도록 구성된 window 기반 AngularVirtualizer 인스턴스를 반환합니다.