将图像文件发布到在Ionic 3中不起作用的事件

时间:2019-02-21 08:13:23

标签: ionic-framework ionic3

我正在Ionic App中工作,并且已经在我的应用程序中进行了更新配置文件图像功能,并且可以正常工作,但是当我尝试更新用户配置文件图像时,它没有发送正确的图像路径。

这是我的 updateimage.ts

onImageSelected(event) {
    this.selectedImage = event.target.files[0];
    let reader = new FileReader();

    reader.onload = (e: any) => {
      this.imageUrl = e.target.result;
      this.converted_image = "data:image/jpeg;base64,"+this.imageUrl;
    };
    reader.readAsDataURL(this.selectedImage);
  }

  changeProfileImage()
  { 
    this.storage.get("ID").then((val) =>
    {
      if(val)
      { 
        var fd = new FormData();
        fd.append('upic', this.selectedImage, this.selectedImage.name);
        fd.append('user_id', val);
        this.restProvider.updateprofileimg(fd, 'update_profilepic/'+val).subscribe((data) => {
          if (data) {
            this.responseEdit = data;
            if (this.responseEdit.status === 'success') {
              this.events.publish('userprofile:created', this.selectedImage); <!-- I am sending the image to the app.html -->
              this.presentAlert(this.responseEdit.msg);
            }
          }
        });
      }
    });
  }

在我的ts文件中,我正在使用以下代码将图像发送到我的app.html,以显示更新的图像:this.events.publish('userprofile:created', this.selectedImage);,但问题是它没有发送正确的图像URL,而是以文件[对象]。

供参考:https://stackblitz.com/edit/ionic-ydphaq

当我将图像发送到我的about.ts时,它显示了错误。

非常感谢您的帮助。

1 个答案:

答案 0 :(得分:2)

publish imageUrl events而不是selectedImage。然后,您可以在subscribeevents的页面中显示图像。

this.events.publish('userprofile:created', this.imageUrl);

StackBlitz Demo