How to create behavior subject for object and subscribe to it on another component?

Question

I have created a behaviour subject in a service class.

    public personObject: BehaviorSubject = new BehaviorSubject({
                        


        

Answer 1

Service

@Injectable()
export class DataService {

  private _dataListSource: BehaviorSubject<IData[]> = new BehaviorSubject([]);
  dataList: Observable<IData[]> = this._dataListSource.asObservable().distinctUntilChanged();

  getDataList(): Observable<any> {
      return this.httpService.get('/data').map(res => {
          this._dataListSource.next(res);
      });
  }
}

TS file

export class DataComponent implements OnInit {

    public dataList$: Observable<IData[]>;

    constructor(public dataService: DataService) {}

    ngOnInit() {
        this.dataList$ = this.dataService.dataList;
        this.dataService.getDataList().subscribe();
    }
}

HTML file

<div *ngIf="dataList$ | async; let dataList; ">
    <div *ngFor="let data of dataList">
        {{ data | json}}
    </div>
</div>

Answer 2

I forgot to mention that I was using I was using ViewContainerRef to create a sibling component and it turns out behavior subject does not work the same way with component created using ViewContainerRef.

Other wise Behaviour subjects of any object work exactly like with number or string. I used @Input to send data to component for now.