When attempting to retrieve the Street name, I am seeing [object Object]. What is the optimal approach for displaying JSON data on the client side?
I managed to display a street name but struggled with other components. How can I access the other elements?
//Interface
export interface Street {
name: string;
color: string;
}
export interface Place {
name: string;
streets: Street[];
stopLights: string[];
similarStreets: string[];
}
// Client Side
<h2>Place List</h2>
<ul *ngFor="let place of places.places">
<li>{{place.name}}</li> //This works and displays the name
<li>{{place.color}}</li> //showing [object Object] for color
</ul>
//JSON Data
{
"places": [
{
"name": "San Jose",
"street": [
{
"name": "1st Street",
"color": "Sharkish"
},
{
"name": "Santa Clara",
"color": "49ers"
}
],
}