I have one shared Service and Two sibling components.
When I have object shared between these two components and I try to change property of one of the object It gets updated but when I have String type shared data It is not updated.If this is the working Why Do I need RXJS then
I know It is object so by reference It should get updated but It is not written anywhere on Angular documentation
Here is my code for service and components
SERVICE
import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
@Injectable()
export class AppServiceService {
data = [{ name: 'init' }];
sharedData: Data[];
// sharedData = new BehaviorSubject<Data[]>(this.data);
constructor() {
this.sharedData = this.data;
}
getData() {
return this.sharedData;
}
}
export interface Data {
name: string;
city?: string;
}
COMPONENT 1
import { Component, OnInit } from '@angular/core';
import { AppServiceService, Data } from '../app-service.service';
@Component({
selector: 'app-hero',
templateUrl: './hero.component.html',
styleUrls: ['./hero.component.css']
})
export class HeroComponent implements OnInit {
data: Data[];
constructor(private appService: AppServiceService) { }
ngOnInit() {
this.data = this.appService.getData();
}
changeValue() {
this.data[0].name = 'kashif';
this.data[0].city = 'mumbra';
}
}
COMPONENT 2
import { Component, OnInit } from '@angular/core';
import { AppServiceService, Data } from '../app-service.service';
@Component({
selector: 'app-villain',
templateUrl: './villain.component.html',
styleUrls: ['./villain.component.css']
})
export class VillainComponent implements OnInit {
data: Data[];
constructor(private appService: AppServiceService) { }
ngOnInit() {
this.data = this.appService.getData();
}
}