I'm 'studying' Angular from a course-book. The example in book is not done by observable, but I have made my example with Json-server and a json file. I would like to update the rating value of the City object within a observable.
I have a city model/object:
export class City {
constructor(
public id: number,
public name: string,
public province: string,
public rating: number,
public highlights?: string[]
) { }
}
I have in my controller defined a variable: currentCityJsonServer$: Observable<City>;
When I click on a button the function updateRating is called, which should modify the rating value, with 1 or -1, of the city object:
export class AppComponent implements OnInit {
public currentCityJsonServer$: Observable<City>;
...
updateRating(rating: number): void {
console.log("This is called from the detail screeen by the function rate via -EventEmitter - met het num: ", rating);
console.log("before update");
this.currentCityJsonServer$
.subscribe(
data => {
console.log("..val =", data);
console.log("..val-name city:", data.name, ' --- rating', data.rating);
},
error => console.log("in error", error),
() => console.log(" observable is now completed.")
);
console.log("Execute update by adding the rating value");
this.currentCityJsonServer$.pipe(
map(currentCityJsonServer => ({...currentCityJsonServer, rating: currentCityJsonServer.rating + rating})),
tap(currentCityJsonServer => console.log("display the new city rating: ", currentCityJsonServer)) // will display the new city
);
//See if the value has been changed
console.log("After update");
this.currentCityJsonServer$
.subscribe(
data => {
console.log("..val =", data);
console.log("..specific value val-rating:", data.rating);
},
error => console.log("in error", error),
() => console.log(" observable is now completed.")
);
console.log("end functie updateRating");
}
...
}
}
After the update value is still zero.
My question is how can I update/change the value of rating property of the City object with an observable?
