While running the Application, I encountered an error in the declaration of constants.ts file where I was assigning data from a json file to constant variables.
In the json file named object.json, I had some data structured like this:
{
"furniture": {
"tb": {
"value": "table",
"display": "Table(s)"
},
"ch": {
"value": "chair",
"display": "Chair(s)"
}
},
"furnitureTypes": [
{
"value": "LivingRoomSofa",
"display": "Living Room Sofa"
},
{
"value": "CoffeeTable",
"display": "Coffee Table"
},
{
"value": "AccentCabinet",
"display": "Accent Cabinet"
}
],
"boardes": [
{
"value": null,
"display": "--"
},
{
"value": "Blockboard",
"display": "Block board"
},
{
"value": "Foamboard",
"display": "Foam board"
},
{
"value": "Fiberboard",
"display": "Fiber board"
}
]
}
Next, I created a constants.ts file and imported the above json data like this:
import * as objData from './objects.json';
In the constants.ts file, I used the imported data to create constant variables like this:
import * as objData from './objects.json';
const obj = <any>objData;
console.log('obj---:',obj);
export const Constants = { farr : [obj.furniture.tb, obj.furniture.ch]; }
When I ran the project, I encountered an error message that said:
Cannot read property 'tb' of undefined at Module../src/app/shared/constants.ts
The console log displayed this information:
obj-- Module {default: {…}, __esModule: true, Symbol(Symbol.toStringTag): "Module"}
I'm wondering why it is showing Module and adding a default key instead of directly displaying the json object data.
What I need is for the console log to show the json object directly like this:
json-obj----------:
{farr: Array(2), furnitureTypes: Array(3), boardes: Array(4), …}
boardes: (4) [{…}, {…}, {…}, {…}]
farr: (2) [{…}, {…}]
furniture: {tb: {…}, ch: {…}}
furnitureTypes: (3) [{…}, {…}, {…}]
__proto__: Object
Here I should be able to access data directly like
obj.tarr.a and obj.tripTypes[0]
However, in my case, the console log is displaying the data like this:
obj---:
Module {default: {…}, __esModule: true, Symbol(Symbol.toStringTag):
"Module"}
default:
boardes: (4) [{…}, {…}, {…}, {…}]
furniture: {tb: {…}, ch: {…}}
furnitureTypes: (3) [{…}, {…}, {…}]
__proto__: Object
Symbol(Symbol.toStringTag): "Module"
__esModule: true
It seems to be showing Module rather than an Object.
How can I get it to display as an
Object?
If anyone has any solutions to this problem, please help me out.