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.
This commit is contained in:
Kristiyan Kostadinov
2019-01-16 19:35:41 +01:00
committed by vivian-hu
parent 76cb9d09a2
commit 3d3179f2f8
2 changed files with 33 additions and 6 deletions
+12 -6
View File
@@ -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();
}
});
}
/**
+21
View File
@@ -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', () => {