fix(scrolling): virtual scroll not disconnecting from data source on destroy (#15856)

Fixes the `CdkVirtualForOf` not calling `disconnect` on its current data source when it's destroyed.

Fixes #15855.

Author: crisbeto

src/cdk/scrolling/virtual-for-of.ts

@@ -30,7 +30,7 @@ import {
   TrackByFunction,
   ViewContainerRef,
 } from '@angular/core';
-import {Observable, Subject} from 'rxjs';
+import {Observable, Subject, of as observableOf} from 'rxjs';
 import {pairwise, shareReplay, startWith, switchMap, takeUntil} from 'rxjs/operators';
 import {CdkVirtualScrollViewport} from './virtual-scroll-viewport';
 
@@ -238,6 +238,7 @@ export class CdkVirtualForOf<T> implements CollectionViewer, DoCheck, OnDestroy
   ngOnDestroy() {
     this._viewport.detach();
 
+    this._dataSourceChanges.next();
     this._dataSourceChanges.complete();
     this.viewChange.complete();
 
@@ -262,15 +263,15 @@ export class CdkVirtualForOf<T> implements CollectionViewer, DoCheck, OnDestroy
   }
 
   /** Swap out one `DataSource` for another. */
-  private _changeDataSource(oldDs: DataSource<T> | null, newDs: DataSource<T>):
+  private _changeDataSource(oldDs: DataSource<T> | null, newDs: DataSource<T> | null):
     Observable<T[] | ReadonlyArray<T>> {
 
     if (oldDs) {
       oldDs.disconnect(this);
     }
 
     this._needsUpdate = true;
-    return newDs.connect(this);
+    return newDs ? newDs.connect(this) : observableOf();
   }
 
   /** Update the `CdkVirtualForOfContext` for all views. */

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

@@ -485,6 +485,23 @@ describe('CdkVirtualScrollViewport', () => {
           .toEqual({start: 0, end: 3}, 'newly emitted items should be rendered');
     }));
 
+    it('should disconnect from data source on destroy', fakeAsync(() => {
+      const data = new Subject<number[]>();
+      const dataSource = new ArrayDataSource(data);
+
+      spyOn(dataSource, 'connect').and.callThrough();
+      spyOn(dataSource, 'disconnect').and.callThrough();
+
+      testComponent.items = dataSource as any;
+      finishInit(fixture);
+
+      expect(dataSource.connect).toHaveBeenCalled();
+
+      fixture.destroy();
+
+      expect(dataSource.disconnect).toHaveBeenCalled();
+    }));
+
     it('should trackBy value by default', fakeAsync(() => {
       testComponent.items = [];
       spyOn(testComponent.virtualForOf, '_detachView').and.callThrough();