Question

我是Angular 2的新手。我的应用程序有一个配置文件，其中列出了所有的API。

我创建了一个定位器服务来加载config.json。其他服务使用此服务获取其特定网址。

@Injectable()
export class LocatorService {
    private config: any;
    private loadConfig: Promise<any>;
    constructor(private _http: Http) {
        this.loadConfig = this._http.get('config/config.json')
                .map(res => this.config = res.json()).toPromise();
    }

    public getConfig() {
        return this.loadConfig.then(() => this.config);
    }
}

我有这个其他服务向网址发送http请求。此服务从定位器服务获取URL。

@Injectable()
export class OtherService {
    private _data: any;
    private url: string;
    constructor(private _http: Http, private locatorService: LocatorService) {
      this.geturl();
    }

    public loadData(): model[] {
      this.geturl().then(() => this._http.get()
                  .map(res => this._data  = res.json())
                  .catch(error =>
                  Observable.throw(error.json().error || 'Server error'))
                  .subscribe(t => this._data = t.json());

       return this._data;
    }

    private geturl() {
        return this.locatorService.getConfig().then(t => {
        this.url = t.serviceUrl;
        console.log(this.url);
        });
    }
}

我的组件调用此loadData n获取所需的数据。我如何实现同样的目标？

我不太清楚如何等待配置url加载然后发送http请求并返回数据。

请帮忙。

Answer 1

您不需要使用Promise这意味着then不需要使用getConfig的{{1}}功能。进行如下更改，并确保您在应用程序中有LocatorService的单个实例并再次检查：

// LocatorService

LocatorService

// OtherService

@Injectable()
export class LocatorService {
    private config: any = null;

    constructor(private _http: Http) {
        if (this.config === null ) {
          this._http.get('config/config.json')
              .map(res => res.json()).subscribe(res => {
                this.config = res;
              });
        }
    }

    public getConfig() {
        return this.config;
    }
}

Answer 2

您可以这样使用：

@Injectable()
export class LocatorService {
    private loadConfig: Promise<any>;
    constructor(private _http: Http) {
        this.loadConfig = this._http.get('config/config.json')
                .map(res => this.config = res.json()).toPromise();
    }

    public getConfig() {
        return this.loadConfig;
    }
}

@Injectable()
export class OtherService {
    private _data: any;
    constructor(private _http: Http, private locatorService: LocatorService) {
    }

    public loadData() {
        Observable.from(this.locatorService.getConfig())
            .switchMap((config) => this._http.get(config.serviceUrl))
            .catch(error => Observable.throw(error.json().error || 'Server error'))
            .subscribe(t => this._data = t.json());
    }
}

如何排队两个可观测量？

2 个答案: