在Angular 8中,你可以通过使用MatDialog
的open
方法来传递多个数据给对话框。以下是一个示例代码:
首先,创建一个包含对话框组件的Component:
import { Component, Inject } from '@angular/core';
import { MAT_DIALOG_DATA } from '@angular/material/dialog';
@Component({
selector: 'app-dialog-component',
template: `
{{ data.title }}
{{ data.message }}
`,
})
export class DialogComponent {
constructor(@Inject(MAT_DIALOG_DATA) public data: any) {}
}
然后,在你的组件中使用MatDialog
打开对话框:
import { Component } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { DialogComponent } from './dialog-component';
@Component({
selector: 'app-my-component',
template: `
`,
})
export class MyComponent {
constructor(private dialog: MatDialog) {}
openDialog(): void {
const dialogRef = this.dialog.open(DialogComponent, {
data: {
title: '标题',
message: '这是一条消息。',
},
});
dialogRef.afterClosed().subscribe((result) => {
console.log('对话框已关闭');
});
}
}
在这个示例中,当点击按钮时,会打开一个对话框,并传递title
和message
数据给对话框组件。这些数据可以在对话框组件中通过MAT_DIALOG_DATA
注入进行访问。
你可以根据需要修改数据的类型和传递的数据。