在Angular 2 Seed项目中根据域名动态设置App Title

Question

我想使用正在运行的环境变量更改 Angular 2 Seed 应用名称。我有两个域和两个环境（DEV、PROD），每个环境我想在运行应用程序时动态更改应用程序名称

我尝试更改扩展 SeedConfig 类的 ProjectConfig 类中的 APP_NAME 变量。当我在 ProjectConfig 中使用环境 TITLE 变量时，程序无法运行。

我在 ProjectConfig 类中设置了this.APP_TITLE = Config.TITLE;。 （Config.TITLE 来自环境。）

我想在 APP TITLE 部分显示正在运行的当前域名。

在index.html文件中有一行

 <title><%= APP_TITLE %></title>

从 ProjectConfig APP_TITLE 变量中获取 App 标题。我尝试使用我的 env TITLE 变量更改 APP_TITLE 变量，以便我可以动态设置应用程序名称。我有两个应用程序，例如“APP NAME 1”、“APP NAME 2”。我为每个域有两个环境（DEV、PROD）和四个使用 EnvConfig 接口的环境 dev.ts、prod.ts、dev2.ts、prod2.ts。 enter image description here 当我跑步时

npm start -- --env-config dev

APP NAME 1 在开发模式下运行。

npm start -- --env-config dev2

APP NAME 2 在开发模式下运行。

简而言之，我想在 index.html 的 APP_TITLE 部分动态显示正在运行的应用名称

Answer 1

我在angular.io/guide/set-document-title使用Title服务解决了这个问题

我只是在 app.component.ts 文件中添加代码

 this.titleService.setTitle(Config.TITLE);

Config.TITLE 值动态来自环境变量。