How can I PUT data into nested JSON in Angular? - json

Question

I have this JSON file.
{mood: [ {
"id":"1",
"text": "Annoyed",
"cols": 1,
"rows": 2,
"color": "lightgreen",
"route":"/angry",
"musics": [
{
"id": "0",
"name": "English- Heaven's Peace",
"image": "images/music.png",
"link": "https://www.youtube.com/playlist?list=PLPfXrbtn3EgleopO8DiEdsNKgqYZZSEKF",
"descpription": "Tunes that soothe your pained soul",
"reviews": [
{
"name": "abc",
"rating": 4,
"review": "energetic",
"date": ""
}
]
},
{
"id": "1",
"name": "English- Hell's Fire",
"image": "images/music.png",
"link": "https://www.youtube.com/playlist?list=PLPfXrbtn3EgmZitRQf1X1iYwWW_nUF44L",
"descpription": "Beats that match the ones of your heart",
"reviews": [
{
"name": "abc",
"rating": 3.5,
"review": "energetic",
"date": ""
}
]
},
{
"id": "2",
"name": "Hindi",
"image": "images/music.png",
"link": "",
"descpription": "",
"reviews": [
{
"name": "abc",
"rating": 4,
"review": "energetic",
"date": ""
}
]
},
{
"id": "3",
"name": "Punjabi",
"image": "images/music.png",
"link": "https://www.youtube.com/playlist?list=PLPfXrbtn3Egnntch2thUO55YqPQgo4Qh7",
"descpription": "",
"reviews": [
{
"name": "abc",
"rating": 4,
"review": "energetic",
"date": ""
}
]
},
{
"id": "4",
"name": "Mix and Match",
"image": "images/music.png",
"link": "https://www.youtube.com/playlist?list=PLPfXrbtn3EglN5LVTETqH3ipRLfXmY6MB",
"descpription": "",
"reviews": [
{
"name": "abc",
"rating": 5,
"review": "energetic",
"date": ""
}
]
}
]
}]
}`
I have created a service that should update any changes in the moods section.
putMood(mood: Mood): Observable<Mood> {
const httpOptions ={
headers: new HttpHeaders({
'Content-Type': 'application/json'
})
};
return this.http.put<Mood>(baseURL + 'moods/' + mood.id, mood, httpOptions)
.pipe(catchError(this.processHTTPMsgService.handleError));
}
And a submit function that should put my newly entered review in the reviews section of my json file under musics section.
onSubmit(){
this.review = this.reviewForm.value;
this.review.date = new Date().toISOString();
this.music.reviews.push(this.review);
this.moodservice.putMood(this.mood)
.subscribe(mood => {
this.mood=mood;
},
errmess => {this.mood = null; this.errMess = <any>errmess;});
}
Using this service and function my review is not uploaded to JSON file. What am I doing wrong?