Question

我正在使用一个带有typescript和webpack的角度2项目。在开发时，我应该使用本地API或测试API。但是在生产中我应该使用真正的API。因此API URL将会更改。

API用于许多服务文件，如产品服务等。

我想在一个文件中编写所有API网址，以便在环境发生变化时轻松更改网址。

我该怎么做？

Answer 1

您可以创建配置文件并将配置值存储为object键值。

<强> config.ts：

export var config = {
  title: "Hello World",
  "SecurityService":"http://localhost/SecurityAPI",
  "CacheService":"http://localhost/CacheServiceAPI"
}

<强> yourComponent.ts：

import { config } from './config';

myTitle = config.title;

完整示例：http://plnkr.co/edit/CGtxYJkcjYt2cEzrbL00?p=info

您还可以对外部配置文件（json）执行http请求;

Plunker：http://plnkr.co/edit/60E2qb9gOjvkEAeR5CtE?p=info

Answer 2

您可以使用静态属性创建TS类：

export class Environment {
   public static API_ENDPOINT = 'http://127.0.0.1:6666/api/';
}

使用如下：

import { Environment } from './environment';

export class MyClass {
    apiEndpoint: string = Environment.API_ENDPOINT;
    ...
}

您还可以创建const对象：

export const environment = {
     API_ENDPOINT: 'http://127.0.0.1:6666/api/'
}

并使用它：

import { environment } from './environment';

export class MyClass {
    apiEndpoint: string = environment.API_ENDPOINT;
    ...
}

设置角度2项目的环境变量

2 个答案: