config.json file:
This is the file we want to load information from. This needs to be globally accessible so will need to be put in a directory under assets.
{ "apiUrl":"http://localhost:9000", "readerUrl": "http://localhost:8088" }
main.ts file:
This loads are new config file.
import {Config} from "./app/app.config"; Config.loadInstance('assets/config/config.json') .then(() => { platformBrowserDynamic().bootstrapModule(AppModule); });
app.module.ts file:
This gets the instance and provides it.
import {Config} from "./app.config"; providers: [ {provide: Config, useFactory: () => Config.getInstance('assets/config/config.json')}, ]
app.config.ts file:
This is the main config code.
import {Injectable} from "@angular/core"; @Injectable() export class Config { private static cache = {}; constructor(private data: any) { } public static loadInstance(jsonFile: string) { return new Promise((resolve, reject) => { var xobj = new XMLHttpRequest(); xobj.overrideMimeType("application/json"); xobj.open('GET', jsonFile, true); xobj.onreadystatechange = () => { if (xobj.readyState == 4) { if (xobj.status == 200) { this.cache[jsonFile] = new Config(JSON.parse(xobj.responseText)); resolve(); } else { reject(`Could not load file '${jsonFile}': ${xobj.status}`); } } } xobj.send(null); }); } public static getInstance(jsonFile: string) { if (jsonFile in this.cache) { return this.cache[jsonFile]; } throw `Could not find config '${jsonFile}', did you load it?`; } public get(key: string) { if (this.data == null) { return null; } if (key in this.data) { return this.data[key]; } return null; } }