如何解决使用@Inject MAT_DIALOG_DATA 传递多个属性
这个对话框是共享的,我需要在不同的情况下使用它。我正在尝试的是在组件使用对话框时接收不同的数据。
我可以正确接收第一个数据,但是“data2”与“data1”相同...是否可以使用两个“@Inject(MAT_DIALOG_DATA)”?
Dialog ctor(我尝试过的)
constructor(public dialogRef: MatDialogRef<DialogComponent>,@Inject(MAT_DIALOG_DATA) public data1: ImportType[],@Inject(MAT_DIALOG_DATA) public data2: string[]) {
this.imports = data1;
this.fieldsToBeEdited = data2;
}
Mat-dialog 配置文件
export class DialogConfig<D = any> implements MatDialogConfig {
disableClose?: boolean;
width?: string;
height?: string;
data1?: D | null;
data2?: D | null;
constructor(data1: any,data2?: string[]) {
this.data1= data;
this.data2= data2;
this.disableClose = true;
this.width = '40%';
this.height = '60%';
}
}
打开对话框方法
openDialog() {
const dialogConfig = new DialogConfig(this.types,this.data);
this.dialogConfig.open(DialogComponent,dialogConfig);
}
解决方法
你可以使用封装对象来传递数据
constructor(public dialogRef: MatDialogRef<DialogComponent>,@Inject(MAT_DIALOG_DATA) public data: DialogData]) {
this.imports = data.imports;
this.fieldsToBeEdited = data.fieldsToBeEdited; }
export interface DialogData{
fieldsToBeEdited: any[,]
imports: any[]
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。