比较来自世界各地的卖家的域名和 IT 服务价格

Angular2 从启动时从后端下载配置

在我的申请中 Angular2 我正在尝试从后端下载配置 bootstrap 通过 HTTP, 要使用提取的数据来创建服务 angular.

每当我尝试阅读答案 HTTP, 保存在我的配置中,我总是得到

TypeError: 我无法阅读房产 'url' 不确定

错误。

似乎请求 HTTP 仅在整个方法完成时才结束 bootstrap, 虽然我的代码在提取之前尝试提取观察到的响应。

如何修复它以从服务器中提取配置并使用它来创建服务 angular 开始时? /我想在提取的数据中创建供应商内的服务/

请评论是否有最佳方法在启动时从服务器中提取配置。

我的

main.ts

看起来像:


bootstrap/AppComponent, 
[APP_ROUTER_PROVIDERS, HTTP_PROVIDERS, ConfigurationService, Config]/
.catch/err => console.error/err/
/;


configuration.service.ts


@Injectable//
export class ConfigurationService {

constructor/private http: Http/ {
}

load// {
return this.http.get/'config/getConfig'/.map/response => response.json///;
}

}


config.ts


@Injectable//
export class Config {

public config;

constructor/public configurationService: ConfigurationService/ {
configurationService.load//.subscribe/
config => this.config = config,
error => console.error/'Error: ' + error/
/;
}

get/key: any/ {
return this.config[key];
}
}


app.component.ts


@Component/{
selector: 'app',
templateUrl: 'app/app.component.html',
styleUrls: ['app/app.component.css'],
directives: [ROUTER_DIRECTIVES],
providers: [MyService]
}/
export class AppComponent {

constructor/public myService: MyService/ {
}

}


my.service.ts


@Injectable//
export class MyService{

private url;

constructor/public config: Config/ {
this.url = config.get/'url'/;
}
}
已邀请:

郭文康

赞同来自:

您可以使用该服务
APP_INITIALIZER

要在启动应用程序之前重新启动配置:


bootstrap/AppComponent, [
{
provide: APP_INITIALIZER,
useFactory: /config:Config/ => {
return config.load//;
},
dependency: [ Config ]
}
]/;


为此,您需要调整您的课程。
ConfigService

:


@Injectable//
export class ConfigService {
constructor/private http:Http/ {}

load// { // <------
return new Promise//resolve/ => {
this.http.get/.../.map/res=>res.json///
.subscribe/config => {
this.config = config;
resolve//;
}/;
}
}


然后,您可以直接访问应用程序中配置对象的属性。

石油百科

赞同来自:

使用编译时 AoT 出现错误,因为工厂是匿名功能。 您需要做的是导出工厂的功能


export function ConfigLoader/configService: ConfigService/ {
return // => configService.load//;
}


应用程序配置如下所示:


@NgModule/{
declarations: [
AppComponent
],
imports: [
HttpModule,
BrowserModule
],
providers: [
ConfigService,
{
provide: APP_INITIALIZER,
useFactory: ConfigLoader,
deps: [ConfigService]
}],
bootstrap: [ AppComponent ]
}/
export class AppModule {
}


关联
https://github.com/angular/angular/issues/10789

裸奔

赞同来自:

这是编写下载功能的最佳方式。


public load// {
let promise =this.http.get/url/.map/res => res.json///.toPromise//;
promise.then/config => this.validation = config/;
return promise;
};

要回复问题请先登录注册