Search code examples
angularcomponentsangular-routingrxjs-observables

Angular 8 - keeping track of displayed components without access to URL params


I have two main components - list and detail. In the third component, which doesn't have a parent/child relationship with either of the first two components, I need to know which component is currently being used/displayed and based on that, perform some actions in it.

Right now, I'm subscribed to URL parameters within each of the two components (list and detail). Within the two subscriptions I'm setting a behaviour subject (using next) to which the third component is subscribed. I set the behaviour subject to 'list' within the subscription to URL parameters within list component and I set the behaviour subject to 'detail' within the subscrription to URL parameters within detail component. That is how the third component always knows which component is being displayed.

I'm sure there is a a better way than to play this kind of ping-pong?


Solution

  • To me your approach seems correct. I made a Stackblitz example of how I would probably handle it: https://stackblitz.com/edit/angular-5mfjbz

    In the example Parent = List and Child = Detail and the Third component observes what's happening in the other components.