CODEWITHSUNDEEP
angularrxjsobservable
Marian07
Marian07

Reputation: 2582

Subscribe multiple Angular2 components to a Service

I am trying to make two Components to get notified through a Service when another Component reacts to a DOM event.

This should be achieved using RxJS Subject Observable, or its direct subclasses(BehaviorSubject or ReplaySubject probably).

This is the model:

Neither of these three components are parent-child.

I tried to follow these approaches:

  1. Angular2 Parent and Children communication via service
  2. RxJSObservable demo explanation

but I didn't manage to adapt them for my needs.


Please check my live example on plnkr.co

Am I on the right path?

Thank you

Upvotes: 1

Views: 1707

Answers (1)

Guilherme Meireles
Guilherme Meireles

Reputation: 7919

I fixed your plunker with a working version.

The problem was that new instances of the NotificationService were created for every component. It should exist only one instance, created in the main component, and the components should share that instance to comunicate.

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>Hello {{name}}</h2>
      <br>
      <trigger-component></trigger-component>

      <first-listening-component></first-listening-component>
      <second-listening-component></second-listening-component>
    </div>
  `,
  providers : [NotificationService]
})
export class App {
  constructor() {
    this.name = 'Angular2'
  }
}

Upvotes: 3

Related Questions