Angular 在开发过程中使用localhost为子域创建HREF

我有几个角度的应用程序，我想有链接到彼此

例如，在App1中，我可能有以下

。当应用程序处于活动状态时，这可以工作，但在开发过程中，这不起作用，因为app2托管在

localhost:50001

上

---

有没有办法设置某种类型的代理来捕获我的子域并在开发期间将它们路由到适当的本地主机？

如果您使用的是angular cli，则可以使用

/src/environments

下的environment.ts文件

可以在这些环境文件中定义特定于环境的值

environment.<some-environment-name>.ts

另一个发展目标

环境.ts（开发环境）

如果您还有其他环境，则可以添加其他环境文件

环境.stage.ts（暂存环境）

然后，在

apps

属性下的

angular cli.json

中声明它们

apps: {
    ..
    ..
    "environmentSource": "environments/environment.ts",  // this should be imported in all the components/services etc
    "environments": {
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts",
        "stage": "environments/environment.stage.ts"
    }
}

在其他任何地方（组件、服务等）使用这些值

然后使用它

foo.service.ts

private readonly API_URL = `${environment.api.baseUrl}/foo`

public getFoo() {
    return this._http.get(API_URL);
}

注意：切勿在任何组件或服务中导入特定的环境文件

比如说,

你不应该这样做

import { environment } from ../environments/environment.prod; // NEVER do this

反而

使用

ng serve

运行时，使用

--environment

或

--env

选项指定环境值，其余的由angular cli处理

ng serve --env=prod  // uses values in environment.prod.ts
ng serve --env=stage // uses values in environment.stage.ts
ng serve             // uses values in environment.ts

执行

ng生成时

，对生产生成使用

--prod

标志

ng build --prod

要使用其他环境进行构建，可以使用

--env

选项指定环境

export const environment = {
    production: true,
    api: {
        baseUrl: "http://app2.apps.com"
    },
    // some other properties if required
};

export const environment = {
    production: false,
    api: {
        baseUrl: "http://localhost:50001"
    },
    // some other properties if required
};

export const environment = {
    production: false,
    api: {
        baseUrl: "http://app2.stagingapp.com"
    },
    // some other properties if required
};

ng build --env=stage

---

希望这有帮助。

您可以使用

环境.ts

文件，可能会有所帮助。您使用的是什么操作系统？您可以在Windows上使用hosts文件进行设置。但在Angular中使用环境可能会更好。@cyberpirate92谢谢你这么简单但有效。@DanielWStrimpel我在Windows 10 Homeso上这是可行的，但Angular将本地主机HREF标记为不安全。这有什么关系吗？

ng build --env=stage