棱 Angular Material |检查对话框是否打开

Question

我正在使用 Angular Material dialog在我的应用程序中显示警告消息。

我需要检查一个对话框是否已经像这样打开:

private _openDialog() {
  // if (this.dialog.isOpen()) return; <-- NOT WORKING
  this.dialog.open(WarningComponent, {
    width: '450px',
    height: '380px',
  });

问题:有什么方法可以检查 Angular Material 对话框是否已经打开？

Answer 1

如果它在单个组件中，只需存储 ref。对操纵它很有用。

private _openDialog() {
  if (!this.dialogRef) return;
  this.dialogRef = this.dialog.open(WarningComponent, {
    width: '450px',
    height: '380px',
  });

  this.dialogRef.afterClosed().pipe(
    finalize(() => this.dialogRef = undefined)
  );
}

如果它是跨组件的，检查打开的对话框列表:

private _openDialog() {
  if (!this.dialog.openDialogs || !this.dialog.openDialogs.length) return;
  this.dialog.open(WarningComponent, {
    width: '450px',
    height: '380px',
  });
}