Dónde guardar la configuración global en Angular 4

Buscamos en diferentes espacios para así regalarte la respuesta a tu dilema, si continúas con alguna difcultad puedes dejarnos tu duda y contestamos con gusto, porque estamos para servirte.

Solución:

Esta respuesta es similar a @trichetriche, con algunos detalles más sobre el código.

Para development/testing propósito

medio ambiente.ts

export const environment = 
  production: false,
  appUrl: 'localhost:4200'
;

Para production

medio ambiente.prod.ts

export const environment = 
      production: true,
      appUrl: 'mywebsite.com'
    ;

Uso

servicio.ts

import  environment  from '../../environments/environment';

this._http.get(environment.appUrl, requestHeaders(options));

Tome nota de production parámetro en todos los environment archivos Creo que también podrías crear más entornos como environment.unittesting.ts.

Cuando comencé a usar Angular 2, usé un archivo global.ts donde puse todas mis variables, para poder cambiarlo fácilmente.

Luego descubrí los entornos proporcionados por angular CLI. Todo lo que tienes que hacer es nombrar un archivo environment.prod.ts (para prod), y uso ng build --prod cuando lo construyas. cuando desarrolles, usa el environment.ts archivo y ambos archivos tienen que tener las mismas variables.

Espero que esto responda tu pregunta.

Tengo otra forma de definir la configuración global. Porque si lo definimos en el archivo ts, si se construye en modo de producción, no es fácil encontrar constantes para cambiar el valor.

export class SettingService  

  constructor(private http: HttpClient) 

  

  public getJSON(file): Observable 
      return this.http.get("./assets/configs/" + file + ".json");
  
  public getSetting()
      // use setting here
  

En la carpeta de la aplicación, agrego la carpeta configs/setting.json

Contenido en setting.json

    "baseUrl": "http://localhost:52555"

En el módulo de la aplicación, agregue APP_INITIALIZER

 
      provide: APP_INITIALIZER,
      useFactory: (setting: SettingService) => function() return setting.getSetting(),
      deps: [SettingService],
      multi: true
    

De esta manera, puedo cambiar el valor en el archivo json más fácilmente.

Apliqué esto en el proyecto para baseUrl, formato de fecha, tiempo de espera de sesión…

Eres capaz de añadir valor a nuestro contenido añadiendo tu experiencia en los comentarios.

---

---

Utiliza Nuestro Buscador