Angular2 中使用 Angular-CLI 的环境特定服务端点

我正在为我的 Angular2 项目使用 Angular-CLI。

我通过 angular2 服务调用后端 ajax 服务。

我对于不同的任务有不同的服务端点（URL）。 我想让这些服务环境变得有意义。

假设我有两个服务

1. 客户服务 ：https://localhost:8080/customers
2. 产品服务：https://localhost:8080/products

Since localhost在我的开发环境中可用。这是工作

现在假设x.x.x.x是我的生产 Web 服务主机 IP 地址。

因此，对于生产环境，服务 URL 将是https://x.x.x.x:8080/customers

请帮助我如何实现这一目标。

我发现 angular-cli.json 文件中有一个块，如下所示

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

但我现在确实找到了环境目录。

如何创建并管理环境特定端点？

命令新建 PROJECT_NAME应该创建这两个文件：

• src/环境/environment.prod.ts
• src/环境/environment.ts

我相信你可以手动创建它。这是生成的代码：

// The file contents for the current environment will overwrite these during build.
// The build system defaults to the dev environment which uses `environment.ts`, but if you do
// `ng build --env=prod` then `environment.prod.ts` will be used instead.
// The list of which env maps to which file can be found in `angular-cli.json`.

export const environment = {
  production: false
};

您可以在两个文件中添加所需的配置以获得尊重的环境：

// src/environments/environment.ts
export const environment = {
  production: false,
  apiUrl: 'http://localhost:8080'
};

...

// src/environments/environment.prod.ts
export const environment = {
  production: true,
  apiUrl: 'https://x.x.x.x'
};

要使用配置只需：

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

//...

let url = `${environment.apiUrl}/customers`;

只需确保您正在导入'../环境/环境'而不是“../environments/environment.prod”。