将数据从一个组件传输到另一个角度

Posted 2023-03-13

【中文标题】将数据从一个组件传输到另一个角度

【英文标题】：transfer data from one component to another angular

【发布时间】：2020-01-09 09:37:01

【问题描述】：

我有 组件 A，它会触发 MatDialog

  openDialog(): void 
   // console.log('The dialog was opened');

    const dialogRef = this.dialog.open(PicuploadComponent, 
      width: '1000px',
      //data: name: this.name, animal: this.animal
    );

    dialogRef.afterClosed().subscribe(result => 
// I want to get data from upload response here! **res**
    );
  

这个组件触发 PicuploadComponent 我上传图片并接收一些数据的响应

onUpload() 
  const fd = new FormData(); 
  fd.append('image', this.selectedFile);
  this.service.uploadImage(fd).subscribe(
    (res:any)=>
    
      console.log(res) ;
      this.dialogRef.close();
    ,    
  );

【问题讨论】：

我已经在对您之前问题的回答中描述了这一点...***.com/a/57822253/2352314

这是一个重复的问题！见：***.com/questions/42664974/…

【参考方案1】：

在 PicuploadComponent 中试试这个：

this.dialogRef.close(res);

访问组件A中的资源：

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

【参考方案2】：

当你关闭对话框时。

this.dialogRef.close(data:'data');

当对话框完全关闭时。

let dialogRef = this.dialog.open(PicuploadComponent, dialogConfig).afterClosed()
  .subscribe(response => 
    console.log(response);
  );

如果您有任何疑问，请告诉我。谢谢。

【参考方案3】：

您应该将uploadImage 调用的结果传递给this.dialogRef.close() 方法。请参阅他们文档中的示例，https://material.angular.io/components/dialog/overview