switch between DEV, QA and PROD easily in angular 4/ionic 3

While building any apps its important for a developer to switch between the environments.
below is a simple way i felt for switching environment in angular 2/4 or ionic 2/3.

its easy with a provider and associative arrays. below is an example:

create a provider called environments and use the below:

_envs = {
dev:{
baseURL:"https://somedev.exaple.net/api/mobile",
    config:{
    serviceRefName:"/demo1",
    serviceRefname2:"/demo2",
    serviceRefname3:"/demo3",
    //...
    //...
    }
}
    qa:{
    baseURL:"https://someqa.exaple.net/api/mobile",
    config:{
    serviceRefName:"/demo1",
    serviceRefname2:"/demo2",
    serviceRefname3:"/demo3",
    //...
    //...
    }
    },
    prod:{
    baseURL:"https://someprod.exaple.net/api/mobile",
    config:{
    serviceRefName:"/demo1",
    serviceRefname2:"/demo2",
    serviceRefname3:"/demo3",
    //...
    //...
    }
    }
 };

 _env={};
 _selectedEnv = "qa";

 //add this line in constructor
 this._env = this._envs[this._selectedEnv];

 //add this method to the environment provider
 getURL(configUrl){
    console.log("configUrl Sec : "+configUrl);
    //console.log("this._env="+JSON.stringify(this._env));
    console.log("URL="+this._env["baseURL"]+this._env["config"][configUrl]);
    return this._env["baseURL"]+this._env["config"][configUrl];
  }

In components, where you want to call a service,

• add environment provider dependency
• use this:  this.environment.getURL("YourSericeName")

for ex: this.environment.getURL("serviceRefname3")

whenever you need to change, simple change the _selectEnv in you Environment provider.
 For ex:
 _selectedEnv = "prod";

It will take the service names from prod obj of _env. this way with a very simple step, you can switch environment in angular.

Note: It has nothing much specific to angular. this logic can be used in any programming language with respective object constructs.