Javascript 角度6-外部化url

我试图在angular 6中具体化url和proerties

有一个调用第三方URL获取数据的服务

weather-component.html->weather.component.ts->weather.service.ts

在我的天气里

public getWeather() {
     // Here I have hardoded the URL and the api key.   
}

我想将其外部化，以使其可配置

---

不确定如何将其移动到可配置文件并从中读取

我想你想做一般性的服务

您可以使用

baseHttp.service.ts

和

weather.service.ts

来扩展baseHttpservice以进行api调用

baseHttp.service.ts

天气服务

因此，您可以注入weather.service.ts并覆盖weather.service.ts中的值并进行http调用

---

因此，

baseHttp.service.ts

充当一个拦截器，因此您可以在那里拦截所有Http调用。

我想您应该使用通用服务

您可以使用

baseHttp.service.ts

和

weather.service.ts

来扩展baseHttpservice以进行api调用

baseHttp.service.ts

天气服务

因此，您可以注入weather.service.ts并覆盖weather.service.ts中的值并进行http调用

---

因此

baseHttp.service.ts

充当拦截器，因此您可以拦截那里的所有Http调用。

与manish的答案完全相同，但当我们在Angular 2中启动项目时，这个博客非常有用。经过多年的升级，http网关已经发生了巨大的变化，当angular在4年更改httpclient时，它非常有用

另外，如果您正在寻找放置基本url等的位置，我将使用angular cli中的环境ts文件

---

与manish的答案完全相同，但当我们在Angular 2中启动项目时，这个博客非常有用。经过多年的升级，http网关已经发生了巨大的变化，当angular在4年更改httpclient时，它非常有用

另外，如果您正在寻找放置基本url等的位置，我将使用angular cli中的环境ts文件

---

你说的外部化或可配置是什么意思？我不确定我的问题是否正确，但请检查此项，以便发布-。简言之，您可以拥有一个特殊的类，其中包含一组可能需要访问的常量。您可以在客户端或服务器上拥有一个json配置文件并获取它。好处是，您可以在构建后更改它。我想您希望有一个服务连接到外部URL或进行http调用。什么是外部化或可配置？我不确定我的问题是否正确，但请检查此项，以便发布-。简言之，您可以拥有一个特殊的类，其中包含一组可能需要访问的常量。您可以在客户端或服务器上拥有一个json配置文件并获取它。好处是你可以在构建后更改它。我想你希望有一个连接到外部URL或进行http调用的服务。

@Injectable()
export abstract class BaseHttpService {
    private baseUrl: string = Constants.BASEURL;
    protected method: string;
    protected serviceUrl: string;
    protected headers: Headers;

    constructor(private http: Http) {
        this.headers = new Headers();
        this.headers.append('Content-Type', 'application/json');
        this.headers.append('Accept', 'application/json');
    }

    call(params: any) {

        let url: string = this.setUrl();

        let options = new RequestOptions({ headers: this.headers });
        options.url = url;
        options.method = this.method;
        options.body = params;
        return this.http.request(url, options).toPromise()
            .then((response: any) => this.extractData(response))
            .catch((error: any) => this.handleError(error));
    }
    //complete the other functions
}

@Injectable()
export class DashboardService extends BaseHttpService {
    constructor(private _http: Http) {
        super(_http);
    }

    getWeatherReport(params:any) {
        this.serviceUrl = 'some-url';
        this.method = "GET";
        return super.call(params);
    }
}