Question

我有一个组件，单击该组件即可获取数据，接收数据并打开模式并将其传递给数据。

模态仍处于打开状态时，我进一步要求提供其他数据。

如何将新数据传递到已经打开的模式中？

这是获取并打开对话框的代码

updateSomeData() {
  // fetch additional data
}

openDialog() {
 this.cqohs.fetchData(this.itemSelected).subscribe(({ data }: any) => {
  this.dialog.open(DialogComponent,
    {
      data: {
        a: this.someData,
        b: this.updateSomeData
      }
    });

此代码将打开，并将数据正确地传递到对话框，并在对话框组件本身中，根据某些条件，我调用函数b，以获取我期望的其他数据。转发回对话框，但这没有发生。已获取附加数据，但没有将其传递给现在已经打开的对话框。

问题

如何将新发现的数据传递到已打开的对话框中？
如果不可能的话，我会认为我的方法是一种反模式，如果是这样，我该如何以一种我期望的方式来实现它？

Answer 1

“材质”对话框中的数据注入（我假设您使用它？）正在与PortalInjector s一起使用：当打开模态时，令牌被注入到其中。

如果希望将其他数据发送到对话框，则不能。

您有几种解决方案：

使用服务共享数据
使用b: this.updateSomeData.apply(this)将当前对象应用于该功能（尽管不推荐）
直接将功能添加到您的DialogComponent中，以使其不依赖其他组件来运行功能：依赖项已加载到您的DialogComponent中。
使用静态方法设置组件（也不推荐）
在打开对话框之前加载所有数据
...

如果您很难选择解决方案，也许给我们您要实现的目标，然后我们可以提供最佳选择。

Answer 2

您似乎正在使用有角度的材料。根据文档Here

open api return引用新打开的对话框。因此，您可以利用它并在需要时更改以传递新的值。

openDialog() {
    let component = this.dialog.open(DialogDataExampleDialog, {
      data: {
        animal: 'panda'
      }
    });
    setTimeout(() => {
        component.componentInstance.data.animal = 'lion'
    }, 5000)
  }

看到它运作Here。等待5秒钟，然后查看数据更改。

您还可以使用共享服务并完成工作，希望这会有所帮助。

更新信息传递给对话框

2 个答案: