Json Object Ref in other json Object - json

Question

I am developing an static website with angular, we've decided to put data in JSON files. But data is quite large and repetitive in nature.
So, I've decided to segregate data in multiple JSON files.
Like
foo.json
{ name: 'Avinash', Age: 88 }
Woo.json
{ City: 'Newyork', Street: 'Lincoln Park' }
Soo.Json
{City: 'Dubai', Street: "Marina"}
Loo.Json
{ Customer: 'foo.json', Address1: 'Woo.json', Address2: 'Soo.Json' }
It should compile all objects to gether on retrieval.
I've read json pointers concept here, thought it might be useful. But I don't know how to do it in Typescript...

Answer 1

Instead of json files, create ts files and export const from there. Something like this:
foo.ts
export const foo = { name: 'Avinash', Age: 88 };
woo.ts
export const woo = { City: 'Newyork', Street: 'Lincoln Park' };
soo.ts
export const soo = {City: 'Dubai', Street: "Marina"};
loo.ts
import { foo } from './foo';
import { woo } from './woo';
import { soo } from './soo';
export const loo = { Customer: foo, Address1: woo, Address2: soo };
loo will contain an aggregated object that you can then import and use in the Component you want.
Something like this:
import { Component } from '#angular/core';
import { loo } from './data/loo';
#Component({...})
export class AppComponent {
ngOnInit() {
console.log(loo);
}
}