CODEWITHSUNDEEP
angularasynchronousreact-reduxrxjsobservable
casbby
casbby

Reputation: 896

Preserve observable value when component is reloaded

I have an angular app (v5). On one of the pages there are two components (A and B). Component A has a grid which upon a cell click push the cell value to a rxjs subject. Component B subscribed to that subject and refresh its content accordingly. This flow works as expected until Component B is moved to a different routerlink.

Looking under the hood I can see that when the cell is clicked on component A, component B was indeed notified the change in its subscription (next) handler. Note at that time component B is not visible yet. When the component B is brought to visibility via the routerlink click it’s UI doesn’t reflect the value in the subject(observable).

  1. Is the ‘visibility’ the issue?
  2. Does the routerlink click cause component B to be reloaded and lose the data it captured from the subject?
  3. Is the subject not the right type to facilitate such communication? I understand the routerlink can have parameters but that is not what I need. The updates to the subject can come from different sources besides component A. Component B needs to reflect the up to date info from the subject whenever it is brought to visibility.
  4. What is the correct way to implement cross components async communization?

Upvotes: 1

Views: 327

Answers (1)

Sandip Jaiswal
Sandip Jaiswal

Reputation: 3730

You should use BehaviourSubject in this scenario. BehaviourSubject emits last value. So when you will subscribe in component B it will recieve last value emited by component A.

Hope it will help

Upvotes: 2

Related Questions