如何重用Angular项目的构建
我如何重用我的Angular构建,所以我不必为每个特定的环境构建?
我们需要找到一种在Angular中运行环境的方法!
我们为每个环境设置了设置,我们使用NG build --env = dev并为开发环境构建。 我如何在QA,UAT和生产环境中更改配置?
工具集:.Net Visual Studio团队服务,Angular 2
运行时没有办法做到这一点吗? 我们是否坚持构建时间/设计时间?
我们也可以考虑根据我们的URL来选择具有后缀的环境吗? https:// company-fancyspawebsite- qa .azurewebsites.net
PS:我们正在为每个环境使用Angular 2环境文件夹和应用程序设置文件。



我使用配置服务在运行时提供可编辑的配置设置。 (这是使用angular-cli)
config.service.ts
import { Injectable } from '@angular/core';
import { Http, Headers, RequestOptions, Response } from '@angular/http';
export interface Config {
    PageSize: number;
    EnableConsoleLogging: boolean;
    WebApiBaseUrl: string;
}
@Injectable()
export class ConfigService {
    private config: Config;
    constructor(private http: Http) { }
    public getConfigSettings(): Config {
        if (!this.config) {
            var Httpreq = new XMLHttpRequest();
            Httpreq.open("GET", 'config.json', false);
            Httpreq.send(null);
            this.config = JSON.parse(Httpreq.responseText);
            if (this.config.EnableConsoleLogging)
                console.log("Config loaded", this.config);
        }
        return this.config;
    }
}
config.json位于我的src文件夹中
{
  "WebApiBaseUrl": "http://myWebApi.com",
  "EnableConsoleLogging": true,
  "PageSize": 10
}
将config.json添加到.angular-cli.json中的资产中
{
  },
  "apps": [
    {
      "assets": [
        "config.json"
      ]
    }
  }
}
如何使用它
export class MyComponent {
    private config: Config;
    constructor(private configService: ConfigService) {
        this.config = configService.getConfigSettings();
        console.log(this.config.WebApiBaseUrl);
    }
}
