读取Observable变量的值而不重新运行已分配的函数-Java 学习之路

我目前在我的角度组件中有一个函数，只要我想上传文件列表就会运行 .

我想要跟踪上传进度，然后清空文件列表并跟踪进度条的上传进度 .

我当前的问题是，当我请求 uploadProgress 的值时，它重新运行 this.pictureService.upload(this.selectedFiles) 并且它上传文件两次 .

我的功能目前看起来像这样：

uploadImages() {
  // Upload picture and save progress to observable
  const uploadProgress: Observable<HttpEvent<HttpUploadProgressEvent>> = this.pictureService.upload(this.selectedFiles);

  // Create snackbar with observable for progress bar
  this.snackBar.openFromComponent(UploadProgressComponent, {
    data: { uploadProgress },
  });

  // Wait for uploading to be finished and then clear selected files and preview URLs
  uploadProgress.subscribe((event: HttpUploadProgressEvent) => {
    if (event.loaded === event.total && event.loaded !== undefined) {
      this.selectedFiles = null;
      this.previewUrls = [];
    }
  });
}

2 回答

正如马丁建议的那样，我在常量的末尾添加了 .pipe(share()) ，它现在按预期工作 .

我的代码现在看起来像这样：

uploadImages() {
  // Upload picture and save progress to observable
  const uploadProgress = this.pictureService.upload(this.selectedFiles).pipe(share());

  // Create snackbar with observable for progress bar
  this.snackBar.openFromComponent(UploadProgressComponent, {
    data: { uploadProgress },
  });

  // Wait for uploading to be finished and then clear selected files and preview URLs
  uploadProgress.subscribe((event: HttpUploadProgressEvent) => {
    if (event.loaded === event.total && event.loaded !== undefined) {
      this.selectedFiles = null;
      this.previewUrls = [];
    }
  });
}

回复于 2024-05-04T19:07:43+08:00

每次调用.subscribe都会调用observable（参见here . ）

如果你在openFromComponent函数中这样做，请考虑不再调用.subscribe，但是这样的话：

uploadImages() {
// Upload picture and save progress to observable
const uploadProgress: Observable<HttpEvent<HttpUploadProgressEvent>> = this.pictureService.upload(this.selectedFiles);

// Create snackbar with observable for progress bar
this.snackBar.openFromComponent(UploadProgressComponent, {
  data: {
    uploadProgress.pipe(tap((event: HttpUploadProgressEvent) => {
      if (event.loaded === event.total && event.loaded !== undefined) {
        this.selectedFiles = null;
        this.previewUrls = [];
      }
    }))
  }
})

}

回复于 2024-05-04T19:07:43+08:00

读取Observable变量的值而不重新运行已分配的函数

2 回答

相关问题