I could really use some guidance to help me move forward. My issue involves a store that is an array containing charts, with each item in the array having its own state. The problem arises when a new effect is triggered and makes an API call - it ends up canceling out the previous API call along with the previous stream entirely. Any assistance would be greatly appreciated.
This is what the effect currently looks like:
@Effect() addCharts$ = this.actions$ .ofType(LOAD_CHART) .switchMap((action) => { return this.chartApi.getChart(action.payload.url).map((res) => { res.id = action.payload.id; res.url = action.payload.url; return res; }); }) .map((result: any) => { debugger; return { type: LOAD_CHART_SUCCESS, payload: result } }) .catch((error: any) => { debugger; return Observable.of({ type: LOAD_CHART_FAILURE, payload: error.detail }); });
As a result, my store ends up looking like this:
[
{
id: 1,
data: null,
loading: true,
loaded: false
},
{
id: 2,
data: {
...
}
loading: false,
loaded: true
}
]