forkJoin.solution.md 921 Bytes
Newer Older
micha's avatar
micha committed
1
2
# Combining HTTP requests - Solution

Julian's avatar
Julian committed
3
## Implementation
micha's avatar
micha committed
4
5
6
7
8

**Component**
```Typescript
// solution.forkJoin.component.ts 

Julian's avatar
Julian committed
9
10
11
12
import {forkJoin, Observable} from 'rxjs';
import {map} from 'rxjs/operators';
import {BlogPost, toBlogPosts} from 'shared';
import {ForkJoinBlogService} from './fork-join-blog.service';
micha's avatar
micha committed
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

export class SolutionForkJoinComponent {
  // ...

  blog$: Observable<BlogPost[]> = forkJoin([
        this.blogPostService.httpGetPosts(),
        this.blogPostService.httpGetComments()
    ])
    .pipe(
       map(([posts, comments]) => toBlogPosts(posts, comments))
    )
      
  constructor(private blogPostService: ForkJoinBlogService) {
  }

}
```
Julian's avatar
Julian committed
30
31
32
33

## Conclusion

Great! We managed to combine two http calls with the `forkJoin` operator into a single list of `BlogPost`. But what if we want to
MariaLazarova's avatar
MariaLazarova committed
34
handle ongoing Observables? In the next step we refactor our architecture to a minimal http caching solution.