Angular2 顺序 POST 调用

Question

我有一组 POST 尝试按顺序发送，例如：

if (this.ifoForm.valid) {
    if (this.otherCheck && (!this.selectedLang || !this.selectedInterp)) {
        swal('Error!', 'Please choose Language and Interpreter!', 'error');
    } else {
        // create CallTracker entity
        this.createCallLog();
        // create CTClient entity
        this.createCTClient();
        // create CTTeln entity
        this.createCTTelns();
        // create CTClientOffence entities
         this.createCTClientOffences();
    }
}

问题是 CTClient 无法创建 w/o 一个 CallTracker（通话记录）实体，与 CTTelns 相同。在存在 CallTracker 和 CTClient 个实体之前，也无法创建 CTClientOffences。

我的容器组件实体对象在 POST return:

时实例化

private callLog: CallTracker;
private logClient: CTClient;
private logTelns: CTTeln[];
private logCharges: CTClientOffence[];

例如：

public onLogNotify(callLog): void {
    // add new CallTracker entity to database
    this._callTrackerService.addLog(callLog)
        .subscribe(
            res => this.callLog = res,
            err => console.log(err)
        );
}

我的问题是：在适当的对象被实例化之前，我可以使用这些对象来限制对后续 POSTS 的调用吗？即我可以使用什么来代替 .timeout():

public onClientNotify(client): void {
    // add new CTClient entity to database
    this._ctClientService.addCTClient(client)
        .timeout(2000) // wait for CallTracker entity to be made
        .subscribe(
            res => this.logClient = res,
            err => console.log(err)
        );
}

Answer 1

我用这个模式想通了：。

演示组件：

if (this.ifoForm.valid) {
    if (this.otherCheck && (!this.selectedLang || !this.selectedInterp)) {
        swal('Error!', 'Please choose Language and Interpreter!', 'error');
    } else {
        // perform POSTs
        this.doPostCalls();
    }
}

 @Output() dataNotify: EventEmitter<any> = new EventEmitter<any>();
// CREATE (POST) DATABASE ENTITIES
private doPostCalls(): void {
    // execute functions
    this.createCallLog();
    this.createCTClient();
    this.createCTTelns();
    this.createCTClientOffences();
    // send data to parent component for http calls
    this.dataNotify.emit({
        callLog: this.newCallLog,
        client: this.newLogClient,
        telns: this.telnData,
        charges: this.chargesData
    });
}

容器组件：

public onDataNotify(data): void {
    this.callLog = data.callLog;
    this.logClient = data.client;
    this.logTelns = data.telns;
    this.logCharges = data.charges;
    if (this.callLog != undefined) {
        this.createCallTrackerEntity();
    }
}

public createCallTrackerEntity(): void {
    console.log("In: onLogNotify(data)");
    // add new CallTracker entity to database
    this._callTrackerService.addLog(this.callLog)
        .subscribe(
        res => console.log("CallTracker Data Added."),
        err => console.log(err),
        () => this.createCTClientEntity()
        );
}

public createCTClientEntity(): void {
    console.log("In: onClientNotify(client)");
    // add new CTClient entity to database
    this._ctClientService.addCTClient(this.logClient)
        .subscribe(
        res => console.log("CTClient Data Added."),
        err => console.log(err),
        () => this.createCTTelnEntities()
        );
}

public createCTTelnEntities(): void {
    console.log("In: onTelnNoify(telns)");
    // add new CTTeln entity to database
    this._ctTelnService.addCTTeln(this.logNumber, this.logTelns)
        .subscribe(
        res => console.log("CTTeln Data Added."),
        err => console.log(err),
        () => this.createCTClientOffenceEntities()
        ); 
}

public createCTClientOffenceEntities(): void {
    console.log("In: onOffenceNotify(offences)");
    // add mew CTClientOffence entity to database
    this._ctClientOffenceService.addCTClientOffence(this.logNumber, this.maxClientId, this.logCharges)
        .subscribe(
        res => console.log("CTClientOffence Data Added."),
        err => console.log(err)
        );

}

Angular2 顺序 POST 调用

Angular2 Sequential POST Calls

post

http

client-side

rxjs

angular