title: change proxy configuration targets dynamically in angular
body: <p>In my angular application, I am using proxy configuration file consisting of some proxies. My file looks like this.</p>
  
  <p><strong>proxy.conf.json</strong></p>
  
  <pre><code>{
    "/login": {
      "target": "http://w3:8080",
      "changeOrigin":true,
      "secure": false
    },   
    "/api/usersvcs/*": {
      "target": "http://w3:8080",
      "pathRewrite": {"^/api/usersvcs": ""},
      "secure": false,
      "logLevel":"debug"
    },
    "/api/ordersvcs/*": {
      "target": "http://w3:8989",
      "pathRewrite": {"^/api/ordersvcs": ""},
      "changeOrigin":true,
      "secure": false,
      "logLevel":"debug"
    },
    "/api/paymentsvcs/*": {
      "target": "http://w3:9898",
      "pathRewrite": {"^/api/paymentsvcs": ""},
      "changeOrigin":true,
      "secure": false,
      "logLevel":"debug"
    },
  }
  </code></pre>
  
  <p>This file is in root directory of my project (outside <strong>src</strong> folder).
  Every time I need to change target parameter if I want to work with some other back end services hosted on different ports. In the above file, I am working with <strong>w3</strong> , and then the port numbers after colon.
  If I want to work with <strong>w5</strong>, I have to change the entire path targets like this.</p>
  
  <pre><code>{
    "/login": {
      "target": "http://w5:8080",
      "changeOrigin":true,
      "secure": false
    },   
    "/api/usersvcs/*": {
      "target": "http://w5:8080",
      "pathRewrite": {"^/api/usersvcs": ""},
      "secure": false,
      "logLevel":"debug"
    },
    "/api/ordersvcs/*": {
      "target": "http://w5:8989",
      "pathRewrite": {"^/api/ordersvcs": ""},
      "changeOrigin":true,
      "secure": false,
      "logLevel":"debug"
    },
    "/api/paymentsvcs/*": {
      "target": "http://w5:9898",
      "pathRewrite": {"^/api/paymentsvcs": ""},
      "changeOrigin":true,
      "secure": false,
      "logLevel":"debug"
    },
  }
  </code></pre>
  
  <p>I am using <code>npm start</code> command in which I have included <code>proxy.conf.json</code> file which looks like below in <code>package.json</code></p>
  
  <pre><code>"scripts":{
     ...
     "start": "ng serve --proxy-config proxy.conf.json --o",
     ...
  },
  </code></pre>
  
  <p>Is it possible to change the target hostnames something like if I use</p>
  
  <p><code>npm start w5</code></p>
  
  <p>then the proxy file should be like one above with the targets having w5.</p>