在 Angular 1.x 中,您可以像这样定义常量:
angular.module('mainApp.config', [])
.constant('API_ENDPOINT', 'http://127.0.0.1:6666/api/')
Angular(使用 TypeScript)中的等价物是什么?
我只是不想在我的所有服务中一遍又一遍地重复 API 基本 URL。
原文由 AndreFeijo 发布,翻译遵循 CC BY-SA 4.0 许可协议
在 Angular 1.x 中,您可以像这样定义常量:
angular.module('mainApp.config', [])
.constant('API_ENDPOINT', 'http://127.0.0.1:6666/api/')
Angular(使用 TypeScript)中的等价物是什么?
我只是不想在我的所有服务中一遍又一遍地重复 API 基本 URL。
原文由 AndreFeijo 发布,翻译遵循 CC BY-SA 4.0 许可协议
在阅读了该线程的所有答案以及其他一些答案之后,我想提供我这些天正在使用的解决方案。
首先,我必须为环境添加一个类。有了这个,我实现了我的属性的数据类型,所以它很容易使用。此外,我可以将默认数据绑定到我的环境,这样我就可以在所有环境之间共享公共数据。有时我们有一些在所有环境中具有相同值的变量(例如站点名称),我们不想每次都更改为所有环境。
// environments\ienvironments.ts
export class IEnvironment implements IEnvironmentParams {
public production: boolean;
public basicURL: string = 'https://www.someawesomedomain.com';
public siteName: string = 'My awesome site';
constructor(params: IEnvironmentParams) {
this.production = params.production ?? false;
this.basicURL = params.basicURL ?? this.basicURL;
this.siteName = params.siteName ?? this.siteName;
}
}
export interface IEnvironmentParams {
production: boolean;
basicURL?: string;
siteName?: string;
}
请注意,我使用 IEnvironmentParams 来简化环境的创建,这样我可以传递对象而不会弄乱构造函数参数并避免参数顺序问题,并且还使用 ??
提供所需的默认值功能 ---
运营商。
// environments\environment.prod.ts
import {IEnvironment, IEnvironmentParams} from "./ienvironment";
const params: IEnvironmentParams = {
production: true
};
export const environment: IEnvironment = new IEnvironment(params);
// environments\environment.ts
import {IEnvironment, IEnvironmentParams} from "./ienvironment";
const params: IEnvironmentParams = {
production: false
};
export const environment: IEnvironment = new IEnvironment(params);
用法示例
import {environment} from "../environments/environment";
// app-routing.module.ts
const routes: Routes = [
{
path: '', component: HomeComponent,
data: {
title: `${environment.siteName} | Home page title!`,
description: 'some page description',
}
}
];
// home.component.ts
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.scss']
})
export class HomeComponent {
constructor() {
console.log(`home component constructor - showing evironment.siteName - ${environment.siteName}`);
}
}
你可以在任何你想要的地方使用它,类、服务、指令、组件等。
对于那些想在构建后替换值的人。你能行的。这有点棘手,但是当您构建 Angular 应用程序时,环境数据会导出到 main.js
,请看下一个屏幕截图。
只需在任何 IDE 中打开文件并找到 environment
然后只需替换数据即可。
关于 Angular 通用项目。构建 Angular Universal 项目时,它将导出 2 main.js
一个用于服务器,一个用于浏览器,因此您必须同时更改两者。
原文由 Raikish 发布,翻译遵循 CC BY-SA 4.0 许可协议
2 回答3.3k 阅读
1 回答970 阅读✓ 已解决
以下更改适用于 Angular 2 最终版本:
然后在服务中: