Question

我关注了这篇文章：https://material.angular.io/components/dialog/examples 并做了一些小的更改以改为传递类对象。

我确信通过查看输出将数据传递到模式组件：

dialogRef.afterClosed().subscribe((result) => {
  console.log(result);
});

下面是代码片段，可让您更好地理解该问题：

在模式部分下：

@input expense: Expense;

  constructor(
    public dialogRef: MatDialogRef<ExpenseModalComponent>,
    @Inject(MAT_DIALOG_DATA) public data: Expense
    ) {
      //this.expense= data;
   }

在父组件中：

openModalWin(exp: Expense):void
   {
    const dialogRef = this.dialog.open(ExpenseModalComponent, {
      height: '400px',
      width: '600px',
      data: {expense: exp} 
    });

模型组件模板：

{{expense.ExpenseID}} 等等等等

如果我不注释上面注释的两行代码，则模式窗口为空白。

我还尝试使用渲染结果相同的结果。

但是，如果我注释掉上面两行代码，那么...就可以了。

您知道在模态对话框中显示组件时为什么数据绑定停止工作的想法吗？

感谢您的任何建议。

Answer 1

嗯...看起来我错过了一些东西，正在工作的内容如下所示，以粗体显示

@input expense: Expense;

  constructor(
    public dialogRef: MatDialogRef<ExpenseModalComponent>,
    @Inject(MAT_DIALOG_DATA) public data: **any**
    ) {
      **this.expense= data.expense;**
   }

Answer 2

您必须访问包含费用键值对的数据，使用 this.data 访问matDialogRef

中的对象

传递给MatDialogRef组件的数据未显示

2 个答案: