CODEWITHSUNDEEP
angularreduxrxjsobservablesubject
Vince
Vince

Reputation: 544

RXJS Observables and Subjects good practice with redux to process data with multiple sources

Using a redux architecture and Observables, I am in a situation when I need to process data after fetching different asynchronous sources.

This is how it is supposed to work:

  1. A top component ensures the data is loaded in the store in the correct format.
  2. A container component subscribes to the 4 datasets and thanks to a combineLatest I process the data when each peaces are gathered,

This seems to work well, but I am not quite sure it is the right way to do.

What is the preferred implementation in this scenario? How would you unsubscribe services and/or access to store? How do you instantiate your observables or subjects?

I am looking here for any best practice or pattern.

Upvotes: 0

Views: 141

Answers (2)

Vince
Vince

Reputation: 544

With a bit more experience on the subject, the answer now seems clear: use Effects.

As API calls are side-effects, your effects can quietly request the data and wait with a combineLatest in order to combine the different datasets.

When this is done, and still in the effect, you can dispatch an action to store the data.

Then, a selector linked to the processed data will provide data to the component.

Upvotes: 0

DeborahK
DeborahK

Reputation: 60596

Are you using NgRx? I assume so since that is the library that implements the redux pattern.

I often find with NgRx that I don't need to implement my own Subject/BehaviorSubject and instead build selectors.

You could build a selector that combines the desired set of data so that the component can simply get the data without having to know about the structure of the store.

Upvotes: 3

Related Questions