I'm facing challenges while trying to access the data due to a type error. I could use some assistance.
Here is a snippet of JSON data:
[{
"productType": "Electronics",
"modelDetails": [
{
"modelId": "I Kall K 48",
"modelPrice": 759,
"specifications": {
"memory": "32 MB RAM | 64 MB ROM",
"display": "4.57 cm (1.8 inch) Display",
}
},
{
"modelId": "I Kall K 48",
"modelPrice"": 759,
"specifications": {
"memory""": "32 MB RAM | 64 MB ROM",
"display":::""4.57 cm (1.8 inch) Display""
}
]
}]
Below is a TypeScript file with an Interface defined:
import { Component, OnInit } from '@angular/core';
import productsData from './jsonFile3.json';
interface Product {
productType: String,
modelDetails: ModelDetails
}
interface ModelDetails {
modelId: String,
modelPrice: Number,
specifications:Specifications
}
interface Specifications {
memory: String,
display: String,
}
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.less']
})
export class AppComponent {
title = 'ngapplication';
name = 'Angular';
products: Product[] = productsData;
}
I am encountering this error:
Error TS2322: Type '{ productType: string; modelDetails: { modelId: string; modelPrice: number; specifications: { memory: string; display: string; }; }[]; }; }[]' is not assignable to type 'Product[]'.
Moreover, when there is only single data in modelDetails, it works fine, but as soon as it becomes an array of objects, even after declaring modelDetails: ModelDetails[]
, it fails to render properly.
Could anyone provide guidance on this issue?
Thank you!