Angular对话框从列表中返回值

import { MatDialog } from '@angular/material/dialog';
import { DialogComponent } from './dialog.component';

@Component({
  selector: 'app-example',
  template: `
    <button (click)="openDialog()">打开对话框</button>
  `
})
export class ExampleComponent {
  constructor(private dialog: MatDialog) {}

  openDialog(): void {
    const dialogRef = this.dialog.open(DialogComponent, {
      width: '250px',
      data: { /* 可选的数据传递给对话框组件 */ }
    });

    dialogRef.afterClosed().subscribe(result => {
      console.log('对话框返回值：', result);
      // 在这里可以处理对话框返回的值
    });
  }
}

import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { Component, Inject } from '@angular/core';

@Component({
  selector: 'app-dialog',
  template: `
    <h1>对话框组件</h1>
    <!-- 对话框内容 -->
  `
})
export class DialogComponent {
  constructor(
    public dialogRef: MatDialogRef<DialogComponent>,
    @Inject(MAT_DIALOG_DATA) public data: any
  ) {}

  closeDialog(): void {
    const returnValue = '返回的值';
    this.dialogRef.close(returnValue);
  }
}