0

This is my first time trying to deploy an Angular4 application. I want to set the URL of an API endpoint, and I would like for it to be different in every environment. what type of changes are to be taken in my source? How to set my angular4 web api to access every environment? can i use virtual-PC? how reading web.config db connection in typescript file?

1 Answers1

0

If i good understand your question, you can create file config.dev.json inside this file you will have

webApiSettings:{
    "url1": "http://localhost:xxxx/api/",
    "url2": "http://pathToOtherApi/api/"
}

After that you can create some file-service.ts to load configuration for example:

class NewClass {
    config.getConfig("webApiSettings").url1
}

You can set your environments locally, but it will be annoying. Put your api on some hosting like heroku for example and fire to this api on heroku from your config.dev.json.

Nyweron
  • 16
  • 2
  • ok i created it then how to implement?Can you please explain brefly,becase i am new in angular 4 web api. –  May 17 '18 at 05:52
  • @BrockJames I try explain, first of all look at this: https://www.metaltoad.com/blog/angular-5-making-api-calls-httpclient-service in this article you have file src/app/demo.service.ts and you have method getFoods. In this method you can read your links to your api's. config.dev.json is file which helps you make code clean. In one file you have all paths to api. – Nyweron May 17 '18 at 06:05
  • can you plese explain how to create a constant file in angular 4? –  May 17 '18 at 06:12
  • @BrockJames Sorry but i don't understand your question, could you explain brefly. If you ask me about constatnt path to api then look at this: https://stackoverflow.com/questions/43916480/how-to-make-a-string-constant-in-angular-4 If you want create a file in angular4 then you click ->new file-> add name file and choose extension (conf.dev.json) – Nyweron May 17 '18 at 06:23
  • ok thanks for your answers,i also create these file then what will i do? –  May 17 '18 at 06:26
  • If you have this file, then you can create services which will load path to api. After that you write logic to your components. – Nyweron May 17 '18 at 06:34