How to config different development environment in Angular 2 app

angular angular2-services
Minna zacharias picture Minna zacharias · Mar 15, 2016 · Viewed 50.5k times · Source

I have a constant file 

export class constants {
    public static get API_ENDPOINT(): string { return 'https://dvelopment-server/'; }
}

And I imported it to my service 

private _registrationUrl = constants.API_ENDPOINT+'api/v1/register';

How can I change the endpont with server change . I have development server staging server and local server. I want app to detect the environment change.

In my angular 1 app I used envserviceprovider for this. Can I use the same in angular 2 app ?

Answer

Cartucho picture Cartucho · May 29, 2016

Short answer: use Angular CLI. It is in beta stage but works really well and it's recommended by the Angular Team for starting new projects. With this tool you can configure different environments. At build time, the src/client/app/environment.ts will be replaced by either config/environment.dev.ts or config/environment.prod.ts, depending on the current CLI environment.

Environment defaults to dev, but you can generate a production build via the -prod flag in either ng build -prod or ng serve -prod. Given that this is a new feature, it can be a bit confuse, so look at this great guide for additional info about how to set up Angular Environments using CLI.

Hope this helps.

Related questions

Angular 2 TypeScript how to find element in Array

I have a Component and a Service: Component: Service: @Injectable() export class PersonService { getPersons(){ var persons: Person[] = [ {id: 1, firstName:'Hans', lastName:'Mustermann', email: '[email protected]', company:'Test', country:'DE'}, {id: 2, firstName:'Muster', lastName:'Mustermann', email: '[email protected]', company:…

Read More
What is the proper use of an EventEmitter?

I've read questions like Access EventEmitter Service inside of CustomHttp where the user uses EventEmitter in his service, but he was suggested in this comment not to use it and to use instead Observables directly in his services. I also …

Read More
Angular2: How to load data before rendering the component?

I am trying to load an event from my API before the component gets rendered. Currently I am using my API service which I call from the ngOnInit function of the component. My EventRegister component: import {Component, OnInit, ElementRef} from "…

Read More