Angular 6返回Observable <Car> 訂閱RxJs zip后

Question

我想返回一個Observable<Car>

import { zip, Observable } from 'rxjs';

public createMedia(car: Car, dataUrl: string): Observable<Car> {
    const url = this.carDataService.createCar(car);
    const blob = this.dataUrlToBlob(dataUrl);
    const z = zip(url, blob);
    z.subscribe(val => this.saveData(val));
    return ...???(I want return Observable<Car> from saveData(val))
}

saveData(val): Observable<Car> {
  console.log('saveData => val 0: ' + val[0].id + ' val 1: ' + val[1]);
  return this.mediaDataService.saveBytes(val[0].id, val[1]);
}

const oMedia: Observable<Car> = this.createMedia(media);
oMedia.pipe(
  tap(media => console.log('Media created with id: ' + media.id)),
  map(media => this.setMediaId(step, media))
);

Answer 1

用管道傳輸到zip結果並使用flatMap運算符：

import { flatMap } from 'rxjs/operators';
import { zip, Observable } from 'rxjs';

public createMedia(car: Car, dataUrl: string): Observable<Car> {
  const url = this.carDataService.createCar(car);
  const blob = this.dataUrlToBlob(dataUrl);

  return zip(url, blob).pipe(
    flatMap(val => this.saveData(val))
  );
}

並且不要忘記訂閱createMedia結果。

oMedia.subscribe(car => console.log('Media created with id: ' + car.id));