My TypeScript file contains String arrays for services and surgeons:
export const servicesData =
[
'test',
'test',
];
export const surgeonsData =
[
'test',
'test',
];
In my application, I have multiple instances of a Component and I want to access these data-store arrays in a static manner so that all instances can use them without fetching them repeatedly.
Here's a summary of my current setup. Each booking component needs to utilize the arrays from the data-model.ts file without re-fetching them every time.
import { surgeonsData, servicesData } from 'app/data-models.ts'
@Component({
selector: 'booking',
template:
`
<div *ngFor="let s of surgeons">
{{s}}
</div>
`
})
export default class BookingComponent {
surgeons = surgeonsData;
services = servicesData;
constructor() {}
}
In the example above, each new component instance saves the surgeonData into the surgeon variable. Instead of this approach, I aim to create a single variable accessible to all components rather than duplicating it with each instance creation.