Angularity

Core
Overview Exceptions Type Container Type-safe Providing
CDK
Overview Breakpoints
API References
cdk / dialog / Class

AnimationAwareDialog

Decorators:@Injectable
Extends:Dialog

Tweaked version of the Dialog service from Angular CDK that supports leaving animations by waiting for animations to complete before disposing the overlay.

See Also

Properties

NameTypeDescription
afterAllClosed
r
inherited from Dialog
Observable<void>

Stream that emits when all open dialog have finished closing. Will emit on subscribe if there are no open dialogs to begin with.

Accessors

get afterOpened

inherited from Dialog

Stream that emits when a dialog has been opened.

Presentation
get afterOpened(): Subject<DialogRef<any, any>>;
Type

Subject<DialogRef<any, any>>

get openDialogs

inherited from Dialog

Keeps track of the currently-open dialogs.

Presentation
get openDialogs(): readonly DialogRef<any, any>[];
Type

readonly DialogRef<any, any>[]

Methods

closeAll()

inherited from Dialog

Closes all of the currently-open dialogs.

Presentation
closeAll(): void;
Returns
void
Overload #1

Closes all of the currently-open dialogs.

Presentation
closeAll(): void;
Returns
void

getDialogById()

inherited from Dialog

Finds an open dialog by its id.

Presentation
getDialogById(id: string): DialogRef<R, C> | undefined;
Parameters
NameTypeDescription
id
string

ID to use when looking up the dialog.

Returns
DialogRef<R, C> | undefined
Overload #1

Finds an open dialog by its id.

Presentation
getDialogById(id: string): DialogRef<R, C> | undefined;
Parameters
NameTypeDescription
id
string

ID to use when looking up the dialog.

Returns
DialogRef<R, C> | undefined

ngOnDestroy()

inherited from Dialog

No documentation has been provided.

Presentation
ngOnDestroy(): void;
Returns
void
Overload #1

No documentation has been provided.

Presentation
ngOnDestroy(): void;
Returns
void

open()

overrides Dialog

Opens a modal dialog containing the given component.

Presentation
open(componentOrTemplateRef: ComponentType<C> | TemplateRef<C>, config: DialogConfig<D, DialogRef<R, C>, BasePortalOutlet> = {}): DialogRef<R, C>;
Parameters
NameTypeDescription
componentOrTemplateRef
inherited from open
ComponentType<C> | TemplateRef<C>
config
inherited from open
DialogConfig<D, DialogRef<R, C>, BasePortalOutlet>

Extra configuration options.

Returns
DialogRef<R, C> -

Reference to the newly-opened dialog.

Example usage

provide({ token: Dialog, useClass: AnimationAwareDialog })

Usage Notes

Currently, when closing a dialog, the corresponding overlay is immediately disposed, which means that the host element of the overlay is immediately removed from the DOM using the native API.

The current behavior completely eliminated the possibility to implement a :leave animation for dialogs, since the ancestor element of the dialog, the overlay, is removed via the native DOM API, and the Angular animation engine cannot hook into this process to perform the :leave animation.

This class works around the issue by waiting :leave animations to complete before disposing the overlay.