如何重用Angular项目的构建

发布时间：2020-12-17 07:21:28 所属栏目：安全来源：网络整理

导读：如何重用我的Angular构建,这样我就不必为每个特定的环境构建？我们需要找到一种在Angular中操作运行环境的方法！我们为每个环境设置了设置,我们使用NG build –env = dev并为开发环境构建.如何在QA,UAT和生产环境中更改配置？工具集：.Net Visual Studio

如何重用我的Angular构建,这样我就不必为每个特定的环境构建？

我们需要找到一种在Angular中操作运行环境的方法！

我们为每个环境设置了设置,我们使用NG build –env = dev并为开发环境构建.如何在QA,UAT和生产环境中更改配置？

工具集：.Net Visual Studio Team Services,Angular 2

在运行时没有办法做到这一点吗？我们是否坚持构建时间/设计时间？

我们也可以考虑根据我们的网址选择具有后缀的环境吗？
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);
    }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!