无法在订阅中分配数据

时间:2017-11-11 14:10:40

标签: angular parsing post null request

我对post方法有一些问题。我总是在temporarySegment中得到空的segmentdata对象。我用数字做同样的方式,这是工作。订阅中的变量结果是SegmentData,在console.log中我收到预期的响应。这怎么可能? 我的方法:

  onGetSegmentsClick(size: number) {
    debugger;
    if (size > 0) {
        let counter = 0;
        let temporarySegment = new SegmentData();
        while (counter < size) {
            this.segmentService.getSegment(counter + 1, this.elementId, this.documentId).subscribe(result => {
                console.log("get segment request is sended");
                temporarySegment = result;
                console.log("gotten message is:", result);
            });
            ModalComponent.segmentsCollection.push(new SegmentData());
            ModalComponent.segmentsCollection[ModalComponent.segmentsCollection.length - 1] =
                ModalComponent.newer.TemporaryObjectEqualizer(temporarySegment);
            ModalComponent.segmentsCollection[ModalComponent.segmentsCollection.length - 1].SegmentDataId =
                counter + 1;
            counter++;
        }
    }
}

我的getSegment方法:

  getSegment(segmentId: number, elementId: string, documentId: string) {
    let headers = new Headers();
    headers.append("Content-type", "application/json");
    let input = {
        "elementId": elementId,
        "documentId": documentId,
        "segmentNumber": segmentId
    }
    let sendingData = JSON.stringify(input);
    let urlPost = "https://localhost:44375/api/data/SendSegmentData";
    let output = new AsyncSubject<SegmentData>();
    let options = new RequestOptions({
        headers: headers,
        method: RequestMethod.Post,
        url: urlPost
    });
    this.http.post(urlPost, sendingData, options)
        .subscribe(result => {
            output.next(result.json());
            output.complete();
        });
    return output;
}

客户端上的Class SegmentData等于服务器上的相关类。我的回答得到了完美的解析。如何解决这个问题? 提前谢谢))

2 个答案:

答案 0 :(得分:0)

订阅调用旁边的代码将在不等待订阅调用结束的情况下执行,因此while循环将在不等待订阅完成并运行的情况下运行。下面的代码被更改为将所有代码放在订阅调用中。

onGetSegmentsClick(size: number) {
    debugger;
    if (size > 0) {
        let counter = 0;
        let temporarySegment = new SegmentData();
        while (counter < size) {
            this.segmentService.getSegment(counter + 1, this.elementId, this.documentId).subscribe(result => {
                console.log("get segment request is sended");
                temporarySegment = result;
                console.log("gotten message is:", result);

            ModalComponent.segmentsCollection.push(new SegmentData());
            ModalComponent.segmentsCollection[ModalComponent.segmentsCollection.length - 1] =
                ModalComponent.newer.TemporaryObjectEqualizer(temporarySegment);
            ModalComponent.segmentsCollection[ModalComponent.segmentsCollection.length - 1].SegmentDataId =
                counter + 1;
            counter++;
          });
        }
    }
}

答案 1 :(得分:0)

其他人已经解释了正在发生的事情。在while循环中subscribe()之后的代码实际上在订阅函数之前运行,因为该函数仅在响应从服务器返回后异步运行。因此,当您尝试使用temporarySegment的值时,它仍为空。

你问:

  

如何等待回复?

您可以使用async / await编码模式使异步代码与您的其余过程一致运行。首先将async修饰符添加到函数声明中:

async onGetSegmentsClick(size:number){ ...

然后将可观察链转换为promise并使用await修饰符告诉JS引擎在继续之前等待结果:

temporarySegment = await this.segmentService.getSegment(...).toPromise();
// here you can use temporarySegment immediately

See the docs