angular - 在可观察管道内使用 await

Question

我是我的 Angular 应用程序，我想将 pdf 下载为 Blob并对其进行处理以获得 Uint8Array .我想在服务中这样做，这将返回给我 rxjs Observable<Uint8Array>但是我不能。我写下面的代码

public loadBinaryPDF(url): Observable<Uint8Array>  {
    return this.httpClient.get(url, { responseType: 'blob' }).pipe(map(async blob => {            
        let arrayBuff = await new Response(blob).arrayBuffer();    // some await here..
        return new Uint8Array(arrayBuff);
    }));
}

但得到编译错误

ERROR in src/services/api-companies.service.ts(454,9): error TS2322: 
  Type 'Observable<Promise<Uint8Array>>' is not assignable to type 'Observable<Uint8Array>'.
Type 'Promise<Uint8Array>' is missing the following properties from type 'Uint8Array': 
  BYTES_PER_ELEMENT, buffer, byteLength, byteOffset, and 25 more.

所以问题是我使用 async-await内 pipe/ map . 如何解决？ (我不想找到允许使用 async-await 并返回 observable 的方法)

Answer 1

您可以直接用作 switchMap而不是 map 。

public loadBinaryPDF(url): Observable<Uint8Array>  {
    return this.httpClient.get(url, { responseType: 'blob' }).pipe(switchMap(async blob => {            
        let arrayBuff = await new Response(blob).arrayBuffer();
        return new Uint8Array(arrayBuff);
    }));
}