fix(bottom-sheet): allow disableClose to be updated after opened (#14711)

Allows for the `disableClose` value of a bottom sheet to be updated after it has been opened, similarly to `MatDialog`.

Fixes #14708.

Author: crisbeto

src/lib/bottom-sheet/bottom-sheet-ref.ts

@@ -27,6 +27,9 @@ export class MatBottomSheetRef<T = any, R = any> {
    */
   containerInstance: MatBottomSheetContainer;
 
+  /** Whether the user is allowed to close the bottom sheet. */
+  disableClose: boolean | undefined;
+
   /** Subject for notifying the user that the bottom sheet has been dismissed. */
   private readonly _afterDismissed = new Subject<R | undefined>();
 
@@ -42,6 +45,7 @@ export class MatBottomSheetRef<T = any, R = any> {
     // @breaking-change 8.0.0 `_location` parameter to be removed.
     _location?: Location) {
     this.containerInstance = containerInstance;
+    this.disableClose = containerInstance.bottomSheetConfig.disableClose;
 
     // Emit when opening animation completes
     containerInstance._animationStateChanged.pipe(
@@ -64,12 +68,14 @@ export class MatBottomSheetRef<T = any, R = any> {
       this._afterDismissed.complete();
     });
 
-    if (!containerInstance.bottomSheetConfig.disableClose) {
-      merge(
-        _overlayRef.backdropClick(),
-        _overlayRef.keydownEvents().pipe(filter(event => event.keyCode === ESCAPE))
-      ).subscribe(() => this.dismiss());
-    }
+    merge(
+      _overlayRef.backdropClick(),
+      _overlayRef.keydownEvents().pipe(filter(event => event.keyCode === ESCAPE))
+    ).subscribe(() => {
+      if (!this.disableClose) {
+        this.dismiss();
+      }
+    });
   }
 
   /**

src/lib/bottom-sheet/bottom-sheet.spec.ts

@@ -459,6 +459,27 @@ describe('MatBottomSheet', () => {
       expect(overlayContainerElement.querySelector('mat-bottom-sheet-container')).toBeTruthy();
     }));
 
+    it('should allow for the disableClose option to be updated while open', fakeAsync(() => {
+      let bottomSheetRef = bottomSheet.open(PizzaMsg, {
+        disableClose: true,
+        viewContainerRef: testViewContainerRef
+      });
+
+      viewContainerFixture.detectChanges();
+
+      let backdrop = overlayContainerElement.querySelector('.cdk-overlay-backdrop') as HTMLElement;
+      backdrop.click();
+
+      expect(overlayContainerElement.querySelector('mat-bottom-sheet-container')).toBeTruthy();
+
+      bottomSheetRef.disableClose = false;
+      backdrop.click();
+      viewContainerFixture.detectChanges();
+      flush();
+
+      expect(overlayContainerElement.querySelector('mat-bottom-sheet-container')).toBeFalsy();
+    }));
+
   });
 
   describe('hasBackdrop option', () => {