diff --git a/src/lib/datepicker/datepicker.spec.ts b/src/lib/datepicker/datepicker.spec.ts
index eadd19caf9ff..53bcb684d5ee 100644
--- a/src/lib/datepicker/datepicker.spec.ts
+++ b/src/lib/datepicker/datepicker.spec.ts
@@ -340,6 +340,29 @@ describe('MatDatepicker', () => {
 
         expect(() => fixture.detectChanges()).not.toThrow();
       });
+
+      it('should clear out the backdrop subscriptions on close', () => {
+        for (let i = 0; i < 3; i++) {
+          testComponent.datepicker.open();
+          fixture.detectChanges();
+
+          testComponent.datepicker.close();
+          fixture.detectChanges();
+        }
+
+        testComponent.datepicker.open();
+        fixture.detectChanges();
+
+        spyOn(testComponent.datepicker, 'close').and.callThrough();
+
+        const backdrop = document.querySelector('.cdk-overlay-backdrop')! as HTMLElement;
+
+        backdrop.click();
+        fixture.detectChanges();
+
+        expect(testComponent.datepicker.close).toHaveBeenCalledTimes(1);
+        expect(testComponent.datepicker.opened).toBe(false);
+      });
     });
 
     describe('datepicker with too many inputs', () => {
diff --git a/src/lib/datepicker/datepicker.ts b/src/lib/datepicker/datepicker.ts
index 61d150e5a8be..9a2c7e41bd24 100644
--- a/src/lib/datepicker/datepicker.ts
+++ b/src/lib/datepicker/datepicker.ts
@@ -352,8 +352,6 @@ export class MatDatepicker<D> implements OnDestroy {
         this._popupRef.updatePosition();
       });
     }
-
-    this._popupRef.backdropClick().subscribe(() => this.close());
   }
 
   /** Create the popup. */
@@ -368,6 +366,7 @@ export class MatDatepicker<D> implements OnDestroy {
     });
 
     this._popupRef = this._overlay.create(overlayConfig);
+    this._popupRef.backdropClick().subscribe(() => this.close());
   }
 
   /** Create the popup PositionStrategy. */