Angular 在运行时更改角度环境变量

我希望能够更改url，我的angular将在构建时从服务器获取资源。我希望在构建过程中传递一个参数来更改url值 背后的原因是部署在不同的docker容器中

环境.docker.ts

导出常量环境={
...
url:“本地主机：8080”
};

---

我希望有如下内容：

ng build--env docker--url:“localhost:9090”

，它将在构建期间更新默认值。

这已经由CLI处理

假设您有几个环境：

environment.ts
environment.local.ts
environment.docker.ts
environment.prod.ts

"environments": {
  "local": "environments/environment.local.ts",
  "docker": "environments/environment.docker.ts",
  "prod": "environments/environment.prod.ts"
}

所有文件必须导出具有不同值的相同变量。这意味着您可以更改

url

属性，但不能删除它

拥有这些环境后，打开

angular cli.json

文件。在

环境

属性下，添加您的环境：

environment.ts
environment.local.ts
environment.docker.ts
environment.prod.ts

"environments": {
  "local": "environments/environment.local.ts",
  "docker": "environments/environment.docker.ts",
  "prod": "environments/environment.prod.ts"
}

现在，您可以使用自己选择的环境进行构建：CLI将使用正确的文件

$ ng build --env docker
$ ng build --env local
$ ng build --env prod

---

创建环境文件

environment.prod.ts

：

export const environment = {
  production: true,
  apiUrl: '$BACKEND_URL'
};

运行

ng build--prod true

现在，在运行之前，替换所有生成的html文件中的变量：

cd dist;
find . -type f -exec sed -i 's~\$BACKEND_URL~https://mybackend.domain.com~g' {} \;

然后，您可以在运行之前运行此替换命令，例如在运行时运行docker容器之前

---

PS：您只能在替换变量“in place”后运行该命令，如果需要，请制作dist的备份副本。

使用

ng build--env docker

，我想更改url值；我想要像

ng build--env docker--url:“localhost:9090”

这样的东西，它将更新默认值；因此，对于使用

docker

环境文件的不同构建，我可以为URL设置不同的值。因此，您的应用程序应该有几个docker容器，每个容器应该有几个URL？所以，如果你有4个容器，每个容器有4个URL，那么你最终会得到16个链接？可能吧！我想完全自定义服务器可以在容器中侦听的端口。同时，默认端口可能已经被容器中的另一个服务使用。您有几种解决方案：1）让用户更改URL 2）从后端获取URL 3）硬编码URL并在运行时切换。你想做其中一件事吗？（因为我没有说，但是

ng build--env docker--url:“localhost:9090”

不可能）