在多个环境中使用的angular4应用程序中编码URL的最佳做法是什么？

Question

我有一个角度4应用程序,我试图找到一种最佳实践方法来创建一个解决方案来创建一个服务或某种解决方案来处理许多网址,以便在开发和生产环境中发出http请求.

此时我的解决方案看起来像这样.

import { Injectable } from '@angular/core';
/**
 * PathsService is like a properties file for all of the URL paths used in the application.
 */
@Injectable()
export class PathsService {

  constructor() {}

  productionEnvironment:string = "https://myproductionenvironment.com"
  developmentEnvironment:string = "https://mydevelopmentenvironment.com"

  activeRoot:string = productionEnvironment;


  loginResource = "/loginresources"
  employeeResource = "/employeeresouces"

  public getLoginResources(): string {
    return this.activeRoot+this.loginResource;
  }

  public getEmployeeResource():string {
    return this.activeRoot+this.employeeResource;
  }




}

虽然我相信这样可以正常工作,但是存在一个小问题,因为我必须在从开发环境切换到生产环境时更改activeRoot.我想知道是否有更好的方法来做到这一点,所以我不必手动切换.我可以使用javascript来获取url,解析它,并以这种方式在生产和开发环境之间切换,但似乎应该有更好的角度方式来解决这个问题.关于这个问题的任何意见将不胜感激.谢谢!

Answer 1

如果您使用的是Angular CLI,则会有一个名为的文件夹environments.在这,你有environment.ts和environment.prod.ts.

在这两个文件中都有一个导出的对象.在此对象中,您可以添加一个let apiUrl = 'your URL;.然后,在您的文件中,您只导入第一个(environment.ts)

然后,当你构建时,你只需要运行ng build --prod,并且在编译时,environment.ts它将使用而不是使用environment.prod.ts

那清楚了吗？