for 루프가있는 Observable.forkJoin

Question

process의 배열 인 processes이라는 구성 요소에 배열을 채우려고합니다. 각 process에는 tasks의 목록이 있습니다.

/processes 및 /process/{processId}/tasks

나는 processes 배열을 채울 처음에 모든 프로세스를 얻을하고 /processes를 사용

그래서 현재, 나는 두 개의 API 호출로 일하고 있습니다. 그런 다음 각 프로세스 ID를 process으로 사용하여 두 번째 API를 호출하여 해당 프로세스의 작업을 가져옵니다.

현재, 내 코드는 다음과 같은 :

this.processes.forEach((process, index) => { 
    myService.getTasks().subscribe((tasks) => { 
     process.tasks = tasks; 
    }) 
}) 

내가 관찰 가능한 배열을 만들고, 마무리 호출이 모든 비동기 기다릴 Observable.forkJoin()를 사용할 수 있다는 것을 이해하지만 난 할 수 있도록하려면 process에 대한 참조가 필요하므로 각 호출에 대한 subscribe 콜백 함수를 정의하십시오. 이 문제에 대해 내가 어떻게 접근 할 수 있는지에 대한 아이디어가 있습니까?

Answer 1

루프를 사용하여 여러 개의 HTTP 요청을 작성한 다음 모두를 개별적으로 구독하지 않으므로 Observable 연결을 많이 열지 않아야합니다.

@Juan Mendes가 언급했듯이 Observable.forkJoin은 프로세스 배열의 각 프로세스 색인과 일치하는 작업 배열을 반환합니다. 그들이 도착하면 다음과 같이 각 프로세스에 작업을 할당 할 수 있습니다

getTasksForEachProcess(): Observable<any> { 

    let tasksObservables = this.processes.map(process, processIdx) => { 
     return myService.getTasks(process) 
      .map(tasks => { 
       this.processes[processIdx].tasks = tasks; // assign tasks to each process as they arrive 
       return tasks; 
      }) 
      .catch((error: any) => { 
       console.error('Error loading tasks for process: ' + process, 'Error: ', error); 
       return Observable.of(null); // In case error occurs, we need to return Observable, so the stream can continue 
      }); 
    }); 

    return Observable.forkJoin(tasksObservables); 
}; 

this.getTasksForEachProcess().subscribe(
    tasksArray => { 
     console.log(tasksArray); // [[Task], [Task], [Task]]; 
     // In case error occurred e.g. for the process at position 1, 
     // Output will be: [[Task], null, [Task]]; 

     // If you want to assign tasks to each process after all calls are finished: 
     tasksArray.forEach((tasks, i) => this.processes[i].tasks = tasksArray[i]); 
    } 
); 

또한이 게시물을 살펴 보시기 바랍니다 : Send multiple asynchronous HTTP GET requests이