Передача данных для работы с MAT DIALOG Angular

Question

Я работаю с MAT Dialog и пытаюсь передать значение переменной с данными формы диалога в функцию, я получаю значение формы, но не значение переменной.См. Прилагаемую диаграмму:

Нажав кнопку, я делаю две вещи, назначаю значение идентификатора задачи переменной и открываюдиалоговое окно:

addSubtask(task){
  this.taskID = task._id;
  const dialogSubTaskRef = this.dialog.open(AddNewSubtaskDialog, {
    data{
     taskID: this.taskID,
     description: this.subtaskDescription,
     dueDate:     this.subtaskDuedate,
    }
  });

  dialogSubTaskRef.afterClosed().subscribe(data => {
      console.log("Subtask Dialog output:", data);
  }
}

Как вы можете видеть, я пытаюсь передать taskID с помощью Dialog's data, но он не отображается, когда я регистрирую data в консоли.

Как передать значение этой переменной по значениям диалоговой формы моей функции?

Спасибо за помощь!

Answer 1

Кажется, что этот подход не работает:

const dialogSubTaskRef = this.dialog.open(AddNewSubtaskDialog, {
    data{
      taskID: this.taskID,
      description: this.subtaskDescription,
      dueDate:     this.subtaskDuedate,
    }
});

Но этот работает:

const dialogConfig = new MatDialogConfig();

dialogConfig.data = {
    taskID: this.taskID,
    description: this.subtaskDescription,
    dueDate:     this.subtaskDuedate,
};

const dialogSubTaskRef = this.dialog.open(AddNewSubtaskDialog, dialogConfig);

Итак, в компоненте диалога я могу сделать это:

@Inject(MAT_DIALOG_DATA) public data: AddSubTaskDialogData) {
  this.id = data.subtaskID;
}

И работает по назначению.

Answer 2

Попробуйте также ... вы забыли разделитель : между key: value

data: value

const dialogSubTaskRef = this.dialog.open(AddNewSubtaskDialog, {
    data:{
      taskID: this.taskID,
      description: this.subtaskDescription,
      dueDate:     this.subtaskDuedate,
    }
});