角度行为主题服务在其他组件中没有更改

Question

我有一个服务，它有来自rxjs的BehaviorSubject。

我们有两个变量

private coordinatesSourceLat = new BehaviorSubject<any>("test");
private coordinatesSourceLng = new BehaviorSubject<any>("test2");
currentCoordinatesLat = this.coordinatesSourceLat.asObservable();
currentCoordinatesLng = this.coordinatesSourceLng.asObservable();

之后，我调用一个更改这两个坐标(lat 和 lng(的方法：

changeCoordinates(lat: any, lng: any) {
console.log("0. servis changeCoordinates, coordinates are: ", lat, lng);
this.coordinatesSourceLat.next(lat);
this.coordinatesSourceLng.next(lng);
}

所以现在，在第一个组件中，我实现了服务并放置：

//this is first component
coordinatesLat:any;
coordinatesLng:any;
ngOnInit() {
this.sightService.currentCoordinatesLat.subscribe(coordinates => this.coordinatesLat = coordinates);
this.sightService.currentCoordinatesLng.subscribe(coordinates => this.coordinatesLng = coordinates);
console.log("1. SightInfo coordinates are: ", this.coordinatesLat);
}

我在第一个组件中添加了一个更改坐标的函数：

getSightCoordinates(){
console.log("getSightCoordinates actiated");
this.sightService.changeCoordinates(this.sight.lat, this.sight.lng);
}

我在第一个组件html 中调用此函数：

<button type="button" class="btn btn-go" (click)="getSightCoordinates()">Go</button>

---

现在，服务中的changeCoordinates方法激活并更改纬度和液化天然气。但是我看不到第二个组件的变化！

在第二个组件中，我还添加了：

coordinatesLat:any;
coordinatesLng:any;

ngOnInit() {
this.sightService.currentCoordinatesLat.subscribe(coordinates => this.coordinatesLat = coordinates);
this.sightService.currentCoordinatesLng.subscribe(coordinates => this.coordinatesLat = coordinates);
console.log("2. map coordinatesLan are: ", this.coordinatesLat);
console.log("2. map coordinatesLng are: ", this.coordinatesLng);
}

服务更改正确，但第二个组件未获得该更改。我在这里错过了什么？

Answer 1

我设法通过首先更改参数以仅发送一个带有 lan 和 lng 的对象来修复此错误。在服务中：

private coordinatesSourceLatLng = new BehaviorSubject<any>({
lat: 43.318415,
lng: 21.893258
});
currentCoordinatesLatLng = this.coordinatesSourceLatLng.asObservable();
changeCoordinates(lat: any, lng: any) {
let obj = {
lat: lat,
lng: lng
}
this.coordinatesSourceLatLng.next(obj);
}

第一个组件：

getSightCoordinates(){
console.log("getSightCoordinates actiated");
this.sightService.changeCoordinates(this.sight.lat, this.sight.lng);
}

最后，第二个组件：

this.sightService.currentCoordinatesLatLng.subscribe(coordinates => {
this.coordinatesLatLng = coordinates;
this.getDirection();
});
getDirection() {
this.origin = { lat: 43.314778, lng: 21.898639 };
console.log("blaivan", this.coordinatesLatLng);
console.log("blaivan", this.coordinatesLatLng.lat);
this.destination = { lat: Number (this.coordinatesLatLng.lat), lng: Number (this.coordinatesLatLng.lng) };
}