Question

假设我在提供程序中具有功能：

saveCar(car: Car) {
    return this.saveCarImages(car).subscribe(
      (data:any) => {
        if(data[0].seats){
          car=data[0];
      }
      return this.api.put(`/car/${car.id}`, car, {
        headers: {
          'Content-Type': 'application/json'
        }
      });
      }
    )
  }

提供商中的此辅助功能必须在保存实际汽车之前执行：

 saveCarImages(car: Car) {
    return Observable.create((observable) => {
      let fileSaver = this.injector.get(FileSaverProvider);
    let promisearr = [];
        promisearr.push(Observable.create((observable) => {
          fileSaver.uploadImage(car.helpImage.file).subscribe(
            (data: any) => {
              car.helpImageId = data.id;
              observable.complete(car);
            }
          )
        })
        )
            promisearr.push(Observable.create((observable) => {
              fileSaver.uploadImage(car.helpImage2.file).subscribe(
                (data: any) => {
                  car.helpImageId2 = data.id;
                  observable.complete(car);
                }
              )
              }));
    return Observable.forkJoin(promisearr);
    });
  }

然后将这段代码保存在组件的 TS文件中：

        this.provider.saveCar(this.car).subscribe(
            (response: any) => {
                if (response) {
                       //success
                }
            },
            (error: any) => {
                      //error
            }
        );

但这不起作用。我要在此处实现的目标是从组件的TS文件中订阅this.api.put（car），但我需要先上传汽车图片，因此this.api.put（car）嵌套在saveImages可观察到。如何从组件的TS文件中订阅this.api.put（car）？

Answer 1

您不需要使用Observable.create方法。这是创建Observable的一种很底层的方法，通常不需要使用。

具体来说，查看您的代码，您可以查看此版本的helper方法是否有效

saveCarImages(car: Car) {
    const fileSaver = this.injector.get(FileSaverProvider);
    const obsArray = [];
    obsArray.push(fileSaver.uploadImage(car.helpImage.file).pipe(map(id => {
       car.helpImageId = id;
       return car;
    })));
    obsArray.push(fileSaver.uploadImage(car.helpImage2.file).pipe(map(id => {
       car.helpImageId2 = id;
       return car
    })));
    return forkJoin(obsArray);
  }

然后saveCar会变成

saveCar(car: Car) {
   return this.saveCarImages(car).pipe(
     map(data => data[0]),
     switchMap(car => this.api.put(`/car/${car.id}`, car, {
        headers: {
          'Content-Type': 'application/json'
        }
      })
    )
  }

此时，您的组件应该可以调用saveCar并订阅它。

订阅嵌套的可观察项

1 个答案: