Передача более одного свойства с помощью @Inject MAT_DIALOG_DATA

#angular #dialog #mat-dialog

#angular #диалоговое окно #мат-диалог

Вопрос:

Этот диалог является общим, мне нужно использовать его в разных случаях. То, что я пытаюсь, — это получать разные данные, когда компонент использует диалоговое окно.

Я могу правильно получить первые данные, но «data2» — это то же самое, что и «data1″… возможно ли использовать два «@Inject(MAT_DIALOG_DATA)»?

Диалог 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);
  }
 

Ответ №1:

Возможно, вы можете использовать инкапсулирующий объект для передачи данных

 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[]
}
 

Комментарии:

1. О, это хороший способ, я попробую здесь, спасибо!