角度材料：弹出窗口：在窗口打开并单击按钮时将数据发送给父级

Question

如何获取 Angular Material 对话框的值，并将其发送给 Parent？

我知道如何在他们关闭对话框后获取数据。 只是好奇如何在对话框仍然打开时获取数据，或者特别是当人们在对话框中按下按钮时。

public openPropertySearchDialog(): void {
  const propertySearchDialogRef = this.propertySearchDialog.open(PropertyGridDialogComponent, 
  {
     width: '1500px',
     height: '950px',
     data: this.propertyList,
     hasBackdrop: false
   });
  
   propertySearchDialogRef.afterClosed().subscribe(result => {
     console.log('propertyResult', result);
   });
}

更新：

这将订阅数据。现在我只需要在 Dialog 组件中按下 Button 时知道数据。考虑为按钮按下事件添加另一个订阅，寻找干净的方式，而不是添加 2 个订阅。

propertySearchDialogRef .componentInstance.propertyOutput.subscribe((data: any) => {
  console.log('test',data);
});

https://material.angular.io/components/dialog/api

许多在线资源是在窗口关闭时，寻找打开并按下按钮（不会关闭对话框）

How to pass data to afterClosed() in Angular Material Dialog in Angular 6

Pass several data from Mat Dialog Angular 4 back to parent

Answer 1

在您的弹出组件上，您可以使用输出事件发射器。

  onAdd = new EventEmitter();
  constructor() {
    
  }
  
  onButtonClicked() {
    this.onAdd.emit('test');
  }

在父组件内部，

  openDialog() {
      const ref = this._dialog.open(InnerComponent);
      const sub = ref.componentInstance.onAdd.subscribe((data) => {
        console.log(data);
      });
      dialogRef.afterClosed().subscribe(() => {
        sub.unsubscribe();
      });
  }

您正在订阅 onAdd 事件。

仅当单击按钮时才会在您的按钮上发出事件 (click) 事件，致电onButtonClicked() –