Currently, I am utilizing JSONPlaceholder in conjunction with Angular as part of my learning process. While I have been following the documentation meticulously and obtaining the correct output, there seems to be an additional element accompanying each object. Take a look at the image below:
https://i.sstatic.net/VFGhW.png
For instance, when retrieving the record with id: 1
, it appears cluttered. Given that there will eventually be numerous records, this issue could become quite messy. Surprisingly, the documentation lacks any information regarding this unexpected addition. How can I go about filtering it out? Below is a snippet of my straightforward TypeScript code.
card.component.ts
import { Component, OnInit } from '@angular/core';
@Component({
...
})
export class CardsComponent implements OnInit {
constructor() { }
ngOnInit() {
this.fetchAllRecords();
}
fetchAllRecords() {
fetch('https://jsonplaceholder.typicode.com/albums/1')
.then(response => response.json())
.then(json => console.log(json))
}
}
In addition, I have prepared a stackblitz for reference. Any guidance you can provide would be greatly appreciated.