Question

我试图了解可观察物的使用，

在一些简单的情况下一切都很好，但在一种情况下我想要压缩几张图像。

我正在使用ng2-img-tools

压缩图像的方法。这降低了图像的质量直到它适合某个fileSize，它以maxSizeInMB的形式给出。组如果要忽略png的alpha通道，则ignoreAlpha为true 虽然图像和压缩它们（不推荐 - alpha 通道将丢失，生成的图像可能与原始图片）。 为每个给定的文件返回一个observable，当一切按计划进行时，onNext会收到一个文件错误对象如果出错。

在我的代码中，我正在执行以下操作：

compressImages(filesToUpload:File[]):Observable<any> {
    if (filesToUpload && filesToUpload.length > 0) {
      return this.ng2ImgToolsService.compress(filesToUpload,GlobalService.MAX_FILE_SIZE_MB).map(response =>  {
        console.log("response is");
        console.log(response)
        return response;
      });
    }
    return Observable.of("no_image").map(response =>  "no_image");

  }


this.imageService.compressImages(filesToUpload).flatMap(result => {
          console.log(result)
          return  this.http.post(...);
        }
      ).catch(UtilsService.handleError);

问题是结果只返回1个文件，我知道我应该在某处使用result.next()，但我不知道如何。

Answer 1

问题是您需要subscribe函数，而不是执行另一个映射。当您订阅可观察对象时，您隐含地将onNext()的值视为结果

this.imageService.compressImages(filesToUpload).subscribe(
    result => {
        // this contains the value of onNext()
        console.log(result)
        return     this.imageService.compressImages(filesToUpload).subscribe(
    result => {
        // this contains the value of onNext()
        console.log(result)
        return  this.http.post(...);
    }, error => {
        // error
    } this.http.post(...);
    }, error => {
        // error
    }

more info on subscribing

修改

如果您想收集流中的所有项目并将其作为一个列表进行操作，您可以像toList()那样使用：

this.imageService.compressImages(filesToUpload).toList().subscribe( result => { // this contains all values from the stream console.log(result) return this.http.post(...); }, error => { // error }

角度2可观察到下一个

1 个答案: