virtual scroll: implement scrollTo functions

src/cdk-experimental/scrolling/auto-size-virtual-scroll.ts

@@ -151,6 +151,11 @@ export class AutoSizeVirtualScrollStrategy implements VirtualScrollStrategy {
     }
   }
 
+  /** Get the offset for the given index. */
+  getScrollOffsetForIndex() {
+    throw new Error('Offset location is not supported with autosize.');
+  }
+
   /**
    * Update the buffer parameters.
    * @param minBufferPx The minimum amount of buffer rendered beyond the viewport (in pixels).

src/cdk-experimental/scrolling/fixed-size-virtual-scroll.ts

@@ -77,6 +77,11 @@ export class FixedSizeVirtualScrollStrategy implements VirtualScrollStrategy {
   /** @docs-private Implemented as part of VirtualScrollStrategy. */
   onRenderedOffsetChanged() { /* no-op */ }
 
+  /** Get the offset for the given index. */
+  getScrollOffsetForIndex(index: number) {
+    return index * this._itemSize;
+  }
+
   /** Update the viewport's total content size. */
   private _updateTotalContentSize() {
     if (!this._viewport) {

src/cdk-experimental/scrolling/virtual-scroll-strategy.ts

@@ -37,4 +37,7 @@ export interface VirtualScrollStrategy {
 
   /** Called when the offset of the rendered items changed. */
   onRenderedOffsetChanged();
+
+  /** Get the offset for the given index. */
+  getScrollOffsetForIndex(index: number);
 }

src/cdk-experimental/scrolling/virtual-scroll-viewport.spec.ts

@@ -167,6 +167,15 @@ describe('CdkVirtualScrollViewport', () => {
       expect(viewport.getRenderedRange()).toEqual({start: 2, end: 6});
     }));
 
+    it('should scroll to offset', fakeAsync(() => {
+      finishInit(fixture);
+      viewport.scrollToOffset(testComponent.itemSize * 2);
+      fixture.detectChanges();
+
+      expect(viewport.elementRef.nativeElement.scrollTop).toBe(testComponent.itemSize * 2);
+      expect(viewport.getRenderedRange()).toEqual({start: 2, end: 6});
+    }));
+
     it('should update viewport as user scrolls down', fakeAsync(() => {
       finishInit(fixture);
 

src/cdk-experimental/scrolling/virtual-scroll-viewport.ts

@@ -25,6 +25,7 @@ import {animationFrameScheduler, fromEvent, Observable, Subject} from 'rxjs';
 import {sampleTime, take, takeUntil} from 'rxjs/operators';
 import {CdkVirtualForOf} from './virtual-for-of';
 import {VIRTUAL_SCROLL_STRATEGY, VirtualScrollStrategy} from './virtual-scroll-strategy';
+import { supportsSmoothScroll } from '@angular/cdk/platform';
 
 
 /** Checks if the given ranges are equal. */
@@ -246,7 +247,40 @@ export class CdkVirtualScrollViewport implements OnInit, OnDestroy {
     }
   }
 
-  /** Sets the scroll offset on the viewport. */
+  /**  Scrolls to the offset on the viewport. */
+  scrollToOffset(offset: number, options = { smooth: false, lazy: false }) {
+    const viewportElement = this.elementRef.nativeElement;
+    const top = this.orientation === 'vertical' ? offset : 0;
+    const left = this.orientation === 'horizontal' ? offset : 0;
+
+    let shouldScroll = true;
+    if (options.lazy) {
+      const currentOffset = this.measureScrollOffset();
+      const currentOffsetEnd = currentOffset + this.getViewportSize();
+      shouldScroll = offset < currentOffset || offset > currentOffsetEnd;
+    }
+
+    if (shouldScroll) {
+      if (options.smooth && supportsSmoothScroll()) {
+        viewportElement.scrollTo({ left, top, behavior: 'smooth' });
+      } else {
+        if (this.orientation === 'vertical') {
+          viewportElement.scrollTop = top;
+        } else {
+          viewportElement.scrollLeft = left;
+        }
+      }
+    }
+  }
+
+  /** Scroll the viewport to the specified index. */
+  scrollToIndex(index: number,  options = { smooth: false, lazy: false }) {
+    const contentSize = this.measureRenderedContentSize();
+    const offset = this._scrollStrategy.getScrollOffsetForIndex(index);
+    this.scrollToOffset(offset, options);
+  }
+
+  /** Internal method to set the scroll offset on the viewport. */
   setScrollOffset(offset: number) {
     // Rather than setting the offset immediately, we batch it up to be applied along with other DOM
     // writes during the next change detection cycle.

src/cdk/platform/features.ts

@@ -27,6 +27,13 @@ export function supportsPassiveEventListeners(): boolean {
   return supportsPassiveEvents;
 }
 
+/**
+ * Check whether the browser supports scroll behaviors.
+ */
+export function supportsSmoothScroll(): boolean {
+  return 'scrollBehavior' in document.documentElement.style;
+}
+
 /** Cached result Set of input types support by the current browser. */
 let supportedInputTypes: Set<string>;