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 - Multiple dependent sequential http api calls。

演示文稿组件：

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呼叫

1 个答案: