diff --git a/src/drawer/component/drawer.component.ts b/src/drawer/component/drawer.component.ts index b356e614b..81a2e94e9 100644 --- a/src/drawer/component/drawer.component.ts +++ b/src/drawer/component/drawer.component.ts @@ -112,6 +112,7 @@ export class DrawerComponent< this.drawerRef.close(); } } + this.drawerService.updateOptions(this); } ngAfterViewInit() { diff --git a/src/drawer/component/internal/internal.component.ts b/src/drawer/component/internal/internal.component.ts index c382ddd60..698a1d995 100644 --- a/src/drawer/component/internal/internal.component.ts +++ b/src/drawer/component/internal/internal.component.ts @@ -21,6 +21,7 @@ import { } from '@angular/common'; import { ChangeDetectionStrategy, + ChangeDetectorRef, Component, ElementRef, InjectionToken, @@ -128,7 +129,10 @@ export class DrawerInternalComponent { isTemplateRef = isTemplateRef; - constructor(private readonly injector: Injector) {} + constructor( + private readonly injector: Injector, + private readonly cdr: ChangeDetectorRef, + ) {} ngAfterViewInit() { this.attachBodyContent(); @@ -206,6 +210,11 @@ export class DrawerInternalComponent { } } + updateOptions(options: DrawerOptions) { + this.options = options; + this.cdr.markForCheck(); + } + show() { this.showHide$$.next('show'); } diff --git a/src/drawer/drawer.service.ts b/src/drawer/drawer.service.ts index 7fae8ed64..69ec0452f 100644 --- a/src/drawer/drawer.service.ts +++ b/src/drawer/drawer.service.ts @@ -47,6 +47,7 @@ export class DrawerService< updateOptions(options: DrawerOptions): void { this.options = merge>(DEFAULT_OPTIONS, options); + this.drawerInternalComponentRef?.instance.updateOptions(this.options); } private createOverlay() { @@ -97,7 +98,7 @@ export class DrawerService< const drawerInternalComponentRef = this.overlayRef.attach( new ComponentPortal(DrawerInternalComponent), ); - drawerInternalComponentRef.instance.options = this.options; + drawerInternalComponentRef.instance.updateOptions(this.options); drawerInternalComponentRef.instance.animationStep$.subscribe(step => { if (step === 'hideDone') { this.invisible$.next(); diff --git a/stories/drawer/basic-drawer.component.ts b/stories/drawer/basic-drawer.component.ts index 2501111ec..fb1a0a0a6 100644 --- a/stories/drawer/basic-drawer.component.ts +++ b/stories/drawer/basic-drawer.component.ts @@ -29,7 +29,6 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'; [divider]="divider" [offsetY]="offsetY + 'px'" [visible]="visible" - [hideOnClickOutside]="true" (close)="closeHandle()" >
header