Angular2 Observable BehaviorSubject service not working

Question

I'm trying to create my own observable service but after i get the initial data from the service, any updates to the service aren't propagated to any subscribers. Service looks like this:

import { Injectable } from '@angular/core'; import { Observable, BehaviorSubject } from 'rxjs/Rx';  @Injectable() export class DataService {   keys : number[] = [4,5,1,3,2];   private data :BehaviorSubject<number[]> = new BehaviorSubject(this.keys);    constructor() {};    public setKey(i:number, val:number) :void {     this.keys[i]=val;     this.data.next(this.keys);   }   public getData() :Observable<number[]> {     return new Observable(fn => this.data.subscribe(fn));   }   public getKeys() :number[] {     return this.keys;   } } 

the component using the service gets the initial data just fine. that component gets its data in the constructor:

constructor(public dataService: DataService) {     dataService.getData().subscribe(data => {       console.log("Gotcha!");       this.data.datasets[0].data = data)     }); }; 

which gives one Gotcha in the console log. But after updating the data with setKey(2,3) somewhere else, i was expecting the this.data.next(this.keys); to send data to all subscribers and data would be updated inside that component accordingly. but no data is sent to the subscribers..

i thought i figured the Observables out but please dont be friendly if i'm missing the point here ;) any pointers in the right direction will be greatly appreciated!

Answer 1

I faced the same issue at some point. It's likely the reason is that your service is not a singleton, i.e. that every subscriber gets a new instance. Contrary to Angular 1, in A2 services are not singletons.

If you want to have one instance of the service shared by multiple services/components, put it in providers of your parent @Component or @NgModule.

@NgModule({   declarations: [],   imports: [],   bootstrap: [AppComponent],   providers: [DataService] }) export class AppModule { }