angular2组件负载问题

时间:2017-09-11 15:38:17

标签: angular angular2-routing

今天我在Angular中遇到了一些奇怪的行为。

我有一个与API一起使用的应用程序,用于从服务器获取数据。 下面是代码部分,这对我的问题很重要。

在使用其中一个ID进入ID的详细信息页面后,我获得了一个具有不同ID的JSON。在此页面上,我使用goback()函数再次访问列表。

在第一次加载时,保存API数据没有任何问题,返回后var tempPromotion保持为空。我没有控制台错误。

可能是什么问题?

ngOnInit(): void {
     // This is where i save the data from the API Call 
    this.promotionListService.getList().then((data) => {
        this.tempPromotion = data;
        this.tempPromotion = this.tempPromotion['response_payload'];
        console.log(this.tempPromotion);
    });
}

    // This is the back Method which is called after a button click
goback() {
    this.location.back();
}


   //Get List Method define the API call
getList(): Promise<any> {

    let Id = '1';
    let serviceDec = "PromotionList";

    return this.ApiClientService.getAPIObject(Id, serviceDec);
}


   // get APIObject makes the call
getAPIObject(param: string, serviceDec: string) {

    // Header mit Key aus LocalStorage
    var header =  new Headers();
    header.append('Content-Type', 'application/json'); // immer zu erst Content-Type
    header.append('x-api-key', this.key);

    let options = new RequestOptions({ headers: header });
    var urlTemp = this.url;
    switch (serviceDec) {

        case 'voucher':
            urlTemp  = urlTemp.concat('?promotionId='+param);
            return this.http.get(urlTemp, options)
                .toPromise()
                .then((response: Response) => response.json())
                .catch(this.handleError);

        case 'PromotionList':
            urlTemp =  API_CLIENT[2];
            return this.http.get(urlTemp, options)
                .toPromise()
                .then((response: Response) => response.json())
                .catch(this.handleError);

        case 'salesChannelList':
            urlTemp =  API_CLIENT[3].concat('?mode='+param);;
            return this.http.get(urlTemp, options)
                .toPromise()
                .then((response: Response) => response.json())
                .catch(this.handleError);


        default:
            console.error('An error occurred. Wrong service declaration.');

    }
}

1 个答案:

答案 0 :(得分:0)

getList()会返回一个可观察对象吗?如果是这样,你需要像这样订阅它:

ngOnInit(): void {
     // This is where i save the data from the API Call 
    this.promotionListService.getList().subscribe((data) => {
        this.tempPromotion = data;
        this.tempPromotion = this.tempPromotion['response_payload'];
        console.log(this.tempPromotion);
    });
}

重要的是要记住,Observable实际上并没有向API发出请求,直到subscribe为止。因此,在您设置订阅之前,您永远不会收到来自observable的任何数据。这可以解释为什么你没有收到任何错误。