Angular 2 - how to fill a local variable with JSON data from an external file

Question

The Angular 2 tutorials I have read place variables directly in the app.component.ts file. For example var BAR below, which pulls data though the {Foo} interface.

import {Component} from 'angular2/core'; import {Foo} from './foo';  @Component({    etc. });  export class AppComponent {    bar = BAR; }  var BAR: Foo[] = [    { 'id': 1 },    { 'id': 2 } ]; 

However, I have the data for BAR in a local JSON file. I don't believe {HTTP_PROVIDER} is necessary. How would I go about getting the JSON data from the external file?

Answer 1

Create a file with this content

export const BAR= [ { 'id': 1 }, { 'id': 2 } ];

save it as BarConfig.ts or some like

later use it as follows

import { BAR } from './BarConfig'; let bar= BAR;

or even better, use BAR directly where you needed