In my current setup, I have a state$ stream that contains messages$s (an array of message streams). As the State$ is updated, new messages$ are added to the array.
My goal is to have a subscriber handle messages from all messages$ in a single stream, ensuring that only correct events are included.
I attempted to use flatMap to merge the messages$ each time, but encountered an issue where old messages$s (from previous state$ values) were being subscribed multiple times.
How can I resolve this?
let allMessages$ = state$.flatMap(s => {
return Observable.merge(s.messages$s)
}
)
allMessages$.subscribe((x)=>{
console.log('message', x)
// message from single message$ appear multiple times
})
The problem arises when the state$ is updated with new items pushed, causing the old ones to be subscribed to multiple times.
state$ --s(1)---------s(2)----
message$s[0]. --m1----m2-----------m4--
message$s[1] ---------------m3--------
allMessages$ --m1----m2-----m3----m4
m1 m4
s(1) represents the state with one message$, while s(2) signifies the addition of a second message$. As a result, allMessages$ emits messages from item1.
What I am aiming for:
state$ --s(1)---------s(2)-----
message$s[0] --m1----m2-----------m4--
message$s[1] ---------------m3--------
allMessages$ --m1----m2-----m3----m4
This simplified situation can be seen in the following fiddle example: http://jsfiddle.net/8jFJH/797/