// shared.service.ts
import { Injectable } from '@angular/core'; 
import { BehaviorSubject } from 'rxjs'; 
@Injectable() 
export class SharedService { 

data = { name: 'Otcollect', type: 'Website' } 

private dataSource = new BehaviorSubject(this.data); 
currentData = this.dataSource.asObservable();

 constructor(){} 

 changeData(newData: any){
 this.dataSource.next(newData); 
 }

}

// parent.component.ts
import { Component, OnInit } from '@angular/core'; 
import { SharedService } from './shared.service'; 
@Component({
 selector: 'parentcomponent', 
 template: `{{data | json}}`
})
export class ParentComponent implements OnInit { 
data: any; 
constructor( private _sharedSer: SharedService ){} 
ngOnInit(){
 this._sharedSer.currentData.subscribe(data => this.data = data); 
} 
onChangeData(){ 
const newData = { name: 'Parent Component', type: 'Parent' } 
this._sharedSer.changeData(newData); } 
} 

// child.component.ts
import { Component, OnInit } from '@angular/core'; 
import { SharedService } from './shared.service'; 
@Component({ 
selector: 'childcomponent', 
template: `{{data | json}}`
})
export class ChildComponent implements OnInit { 
data: any; 
constructor( private _sharedSer: SharedService ){} 
ngOnInit(){ 
this._sharedSer.currentData.subscribe(data => this.data = data); 
} 
onChangeData(){ 
const newData = { name: 'Child Component', type: 'Child' } 
this._sharedSer.changeData(newData); 
} 
}