Question

我有一个组件，单击按钮时会在其中打开MatDialog。对话框关闭时，我要执行操作。这就是我所做的：

const dialogConfig = new MatDialogConfig();
dialogConfig.width = "60%";
dialogConfig.autoFocus=true;
let dialogRef = this.dialog
  .open(MyDialogComponent, dialogConfig)
  .afterClosed()
  .subscribe(e => {
    console.log("Dialog closed");
});

，但控制台上未打印任何内容。

Answer 1

在MyDialogComponent中，将MatDialogRef注入其构造函数中，例如

constructor(private dialogRef: MatDialogRef<MyDialogComponent>){}

，然后明确将其关闭，例如在模板中使用按钮点击事件或类似方法：

在模板中：

<button (click)="onCancelClicked()">Cancel</button>

在组件中：

onCancelClicked(): void {
    this.dialogRef.close();
}

不能完全确定为什么它不按您的方式工作，但是以上就是我一直以来的工作方式。也许您需要显式调用close（）函数。

Answer 2

请查看此工作example。从您的代码中，我看不到错误。请考虑重命名dialogRef，因为它是预订，而不是对话框的引用。

MatDialog的AfterClosed的角方法未调用

2 个答案: