Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

128
Visualizações
How to config different development environment in Angular 2 app

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 ?

over 4 years ago · Santiago Trujillo
3 Respostas
Responde à pergunta

0

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.

over 4 years ago · Santiago Trujillo Relatório

0

I would just like to add put some more light into the answer provided by @Cartucho. He is right about the steps required to setup a personalized environment for your angular 2 apps. I would also like to second the opinion that the article at Guide to Build the app in different environments

But the given article misses out on an important step. Steps to set up a personalized environment are as follows: 1) Create a new file called environment.YourEnvName.ts in the environments folder in the project. 2) Add the Environment description in the "environments" object in the angular-cli.json file.

"environments": {
    "source": "environments/environment.ts",
    "prod": "environments/environment.prod.ts",
    "dev": "environments/environment.dev.ts", 
    "qa": "environments/environment.qa.ts",
    "YourEnvName": "environments/environment.YourEnvName.ts"
  }

3) Once you have made these changes you can build the app for your new environment using the following command.

ng build --environment=YourEnvName or 

ng serve --environment=YourEnvName 

Hope this post is helpful to any new Angular 2 developer.

over 4 years ago · Santiago Trujillo Relatório

0

I have solved the issue by adding a class method

export class config {

    public static getEnvironmentVariable(value) {
        var environment:string;
        var data = {};
        environment = window.location.hostname;
        switch (environment) {
            case'localhost':
                data = {
                    endPoint: 'https://dev.xxxxx.com/'
                };
                break;
             case 'uat.server.com':
                data = {
                    endPoint: 'https://uat.xxxxx.com/'
                };
                break;

            default:
                data = {
                    endPoint: 'https://dev.xxxx.com/'
                };
        }
        return data[value];
    }
}

In my service

private _loginUrl = config.getEnvironmentVariable('endPoint')+'api/v1/login;
over 4 years ago · Santiago Trujillo Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda