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 ，無法使用CallTracker （呼叫日志）實體創建CTTelns 。 除了CTClientOffences不能創建，直到CallTracker和CTClient實體存在。

我的容器組件中有實體對象，這些對象在POST返回時實例化：

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

我使用以下模式弄清楚了： Angular2-多個依賴的順序http api調用 。

演示組件：

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)
        );

}