Javascript Variable Name as Json Object Name

Question

First of all the question title doesn't make sense. Im not sure how can I ask the question in a better way.

Im facing an issue in an Angular 8.1 project. There is a josn file Im importing that in the settings Class (its a service). When the environment.ts file have a variable as app_company. the same name a json file also available. So if the client app_company matches the json file. all the config should be loaded from that file. This is what I need to achieve What I tried so far is .

import { Injectable } from '@angular/core';
import { environment } from '@env/environment';
import * as client1 from './client1.json';



@Injectable({
  providedIn: 'root'
})
export class SettingsService {

  newInstance:object;

  constructor() { }

  config(key : string){

    //  const newInstance = Object.create(window[environment.app_company].prototype);
    //  newInstance.constructor.apply(newInstance);
    //  return newInstance.key;
    //  const newInstance: any = new (<any>window)[environment.app_company];
    // console.log(Object.create(window[environment.app_company]));

     return environment.app_company.key;
  }
}

my json file will look like below

{
    "opNumberLabel" : "OP No"
}

So in the return section if I call client1.opNumberLabel

It works like my expectation , but I try to make that dynamic like environment.app_company.key it not working .

As you can see my tried are commented those are not worked so far :(.

Any hint will highly appreciated . Thanks in advance,

It seems that you wan't to use a string variable to access an object's property, you can do this: client1[environment.app_company.key] more details — Titus
– Titus, Commented Feb 3, 2020 at 11:44
No , the issue is client1 is also dynamic like env app_company value is client1 ,client2 etc — Jobin
– Jobin, Commented Feb 3, 2020 at 11:46
You can store all the clients in an object: const clients = {client1, client2, client3} and use bracket notation to access the appropriate one: clients[env.app_company] — Titus
– Titus, Commented Feb 3, 2020 at 11:48
@Titus I tried that way, seems key is not accessible upto client1 is getting. — Jobin
– Jobin, Commented Feb 3, 2020 at 11:53

Jobin · Accepted Answer · 2020-02-03 12:46:32Z

1

Finally I resolved.

export class SettingsService {

  clients = { client1 , client2  };
  app_company :string;
  default_client = 'client1';

  constructor() { }

  config(label : string){

      this.app_company = environment.app_company;
      if(this.clients[this.app_company].default.hasOwnProperty(label)){
        return this.clients[this.app_company].default[label];
      }else{
        return this.clients[this.default_client].default[label];
      }


  }
}

Thanks to @Titus for the hint.

answered Feb 3, 2020 at 12:46

Jobin

8,2822 gold badges36 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

gr4viton · Accepted Answer · 2020-02-03 12:51:41Z

Would you like to achieve something like that?

import { Injectable } from '@angular/core';
import * as settings from "./environment.json";

interface Settings {
  [key: string]: string
}

type Environment = {
  [key: string]: Partial<Settings>
};

@Injectable({
  providedIn: 'root'
})
export class SettingsService {

  private environment: Environment = {
    app_company: { }
  };

  constructor() {
    this.environment.app_company = settings;
    console.log(this.config("opNumberLabel")); // OP No
  }

  config(key : string){
     return this.environment.app_company[key];
  }
}

{
  "opNumberLabel" : "OP No",
  "settings1": "testSettings1",
  "settings2": "testSettings2"
}

If you would like to have app_company as a dynamic value too, then I would suggest to extend the example:

by creating an init function which could also accept the name of the client.
by passing an object to the SettingsService constructor, with InjectionToken, so you can define what is the current client you are trying to configure.

You might also want to have different environment setup for different clients, so I would suggest to create separate environment json files for each client. You could create an object which would hold every <client>.environment.json with <client> key.

After that you have an object, like that:

const clientEnvironments: Environment = {
    client1: { ... },
    client2: { ... }
};

So by having the name of your current client, you can easily select which environment you want to use.

Collectives™ on Stack Overflow

Javascript Variable Name as Json Object Name

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related