node.js - Get json file globally in angular 4.After refreshing the value is undefined -

i working in angular4 application , want load apiurl config file. i've created json file named 'config.json", configurationservice.ts url key. it's working fine while entered login page if navigate page after refreshing value becomes undefined.

configurationservice.ts file code

    @injectable() export class configurationservice {     config: object;       loadconfig(): observable<any> {     return this.http.get('./config.json')         .map(res => res.json())         .map((data) =>             this.config = data         )         .catch(this.handleerror); }          getconfig(key: any): string {             if (this.config == undefined) {                 this.loadconfig();             }             return this.config[key];         }   employeename(name: string, gender: string): observable<employee[]> {         let apiurl = this.getconfig('apiurl');         } } 

json file

{   "apiurl": "http://localhost:10062/" } 

login page calling service in "ngoninit" method getting result it's working fine

 this.configurationservice.loadconfig()         .subscribe(         res => this.configurationservice.config = res,         error => this.errormessage = error,     ); 

employeecomponent calling service.it's working fine normally. after refreshing in configurationservice 'apiurl' undefined

export class employeecomponent{      employee=any;     errormessage:string;      employeesearch(): void {             this.service.employeename(this.name,this.gender).subscribe(             res=>this.employee=res,             error=this.errormessage=error,         }     }