0

尝试使用 Angular 材质对话框或任何弹出窗口组件。有以下工作，除了最后一个主题。

a) 返回原始屏幕不应该是灰色的，

b）用户允许在其后面的原始第一个窗口中单击返回

c) 将数据发送回原始窗口组件。

d) 允许用户将模式/弹出窗口移动到第二监视器屏幕，双监视器。这是行不通的。

简单地说，它应该是常规弹出窗口。这如何在 Angular Material 对话框中完成？

public openPropertySearchDialog(): void {
    const propertySearchDialogRef = this.openPropertySearchDialog.open(DocumentPropertyGridComponent, {
      width: '800px',
      height: '450px',
      disableClose: true,
      autoFocus: false,
      data: "test",
      hasBackdrop: false
    });

    propertySearchDialogRef.afterClosed().subscribe(result => {});
  }

我们可以使用 javascript window.open，但更喜欢提供完整数据绑定通信服务的 Angular Material。如果还有另一个 Angular 选项，那也可以作为答案。

基本上用户按下 Component 1: "Add Document" variable: selectedDocumentList: Array<string>，并发送数据 Arrow Component 2: cumulativeDocumentList: Arrays<string>。累积列表实时更新。让它与材料窗口对话框一起工作。

（点击图片放大）
在此处输入图像描述

资源：

我怎样才能使 MatDialog 可拖动/角度材质

4

2 回答 2

1

材质对话框不是一个窗口。它只是在绝对位置弹出的 html 元素，即使您将其设为可拖动，它也仅适用于当前窗口，不会超出当前选项卡。window.open 可能是要走的路。

主意：

可以使用仅包含 Material Dialog 的组件创建路由并在 AfterViewInit 挂钩上打开它。

像 https://localhost:8443/dialogs/1 路由和

当您需要在新窗口中打开对话框时，您会调用

  open() {
    const myWindow = window.open(
      'https://localhost:8443/dialogs/1',
      '_blank',
      'width=200, height=100'
    );
  }

并从里面的弹出窗口

  onNoClick(data: string): void {
    this.dialogRef.close();
    console.log(window.opener);
    const parent = window.opener;
    // But is it possible to pass data to parent and make a change?
    // window.close();
  }

如何公开 angular 2 方法？

于 2020-07-09T22:35:17.973 回答
0

其实并不是把组件拖出屏幕那么简单。一种可能的解决方法是向要拖动的模态添加一个按钮，并使该按钮在不同的浏览器选项卡中打开某个组件，您可以将其拖到窗口外的另一个屏幕中。这会带来一些挑战，例如，这个组件需要被路由，可能使用不同的路由器插座，因为您想使用不同的布局。

祝你好运

于 2020-07-09T23:11:27.517 回答