Angular 父可观察方法的多个 Http 调用分组错误

Question

我有一个关于多个 http 调用和在它们发生时捕获错误并能够在父组件上读取它们的问题。我需要知道哪些调用失败了，以便我可以用另一种方法重试它们，但是如果我在组件级别看不到它们，我就不可能知道我需要重试哪个调用

//组件调用

generateDocuments(documentType: DocumentType, validDocuments: DocumentTemplate): observable<any>{
return this.documentService.generateDocuments(clientId, ClientDescription,documentType, validDocuments)}

//服务调用：

generateDocuments(clientId: int, ClientDescription,documentType:DocumentType, validDocuments: DocumentTemplate): observable<any>{

switch(documentType){

documentType.Word:{
return this.getDocumentCall(clientId, ClientDescription, ...)}

documentType.Excel:{
return this.getDocumentCall(clientId, ClientDescription, ...)}
}

// 这一行会根据调用完成的时间一个一个地抛出一个 error/success

 private getDocumentCall(clientId: int, clientDescription: string, ....)
    {
    
    return forkjoin([1,2,4,4,5].map((documentId:number) => {
    
    this.http.get('uri'+documentId+'/'+clientId,headers..).pipe( catchError(error => {
                return of(error);
              });
    });

我的问题是如何知道组件级别的调用成功或失败，或者能够将所有 errors/response 冒泡到组件级别

谢谢

Answer 1

查看 forkJoin here。我觉得你还是传入一个键值对的对象比较好，这样可以更好的识别。

按照你的方式，订阅时每次调用的顺序都是相同的（本质上它仍然在 [1, 2, 3, 4, 5] 中）。

您的 catchError 捕获 API 调用的错误并且 returns 一个成功的错误对象 subscribes.

像这样的事情应该让你开始：

this.service.getDocumentCall(1, 'hello').subscribe(responses => {
  responses.forEach(response => {
     // check if the response is instance of HttpErrorResponse signalling an error
     if (response instanceof HttpErrorResponse) {
        console.log('This call failed');
     } else {
        console.log('This call succeeded');
     }
  });
});

编辑：

尝试这样的事情：

private getDocumentCall(clientId: int, clientDescription: string, ....)
    {
      const calls = {};
      const ids = [1, 2, 3, 4, 5];
      
      // create the calls object
      ids.forEach(id => {
         calls[id] = this.http.get('uri' + id + '/' + clientId, headers...).pipe( catchError(error => {
                return of(error);
              });
      });
      return forkJoin(calls);
    });

this.getDocumentCall(1, '2').subscribe(response => {
  // loop through object
  for (const key in response) {
    if (response[key] instanceof HttpErrorResponse) {
      console.log(`Call with id: ${key} failed`);
    } else {
      console.log(`Call with id: ${key} succeeded`);
    }
  }
});

Angular 父可观察方法的多个 Http 调用分组错误

Angular Multiple Http Call grouping error to parent observable method

angular

typescript

rxjs

observable

fork-join