Наблюдаемая угловая 6 RxJS6 не возвращает данные в правильном порядке

Question

Я перебираю массив и вызываю LoadReportsData.getProjectReportsData в _reportingService вызывается в правильном порядке.Но когда элементы управления возвращаются из сервисной карты, нажимается, а затем .subscribe() код внутри не срабатывает, пока не будут выполнены все вызовы.

После этого результат присваивается this.reportData, но в случайном порядке,Благодаря такому поведению мои рабочие листы в рабочей книге создаются случайным образом, а не в заданном порядке.Пожалуйста, предложите, если есть другой способ звонить и или предложить какой-то обходной путь.

FetchProjectSubmissionReportingAssets(ID: number,
        mySelectiontot: number, PRsDelimitedList: string, StartDate: string, EndDate: string) {

        let currAsset: string = '';
        let ID: number;
        var fetchAssetData = {
            'CSID': ID
        }
        this._reportingService.isLoading = true;
        this._reportingService.getProjSubRptAssets(fetchAssetData).pipe(
            map(result => {
                if (result != null) {

                    for (var i = 0; i < result.length; i++) {
                        this.ProjReqSubmissionReportingAssets = result;


                        currAsset = result[i].option;
                        ID = result[i].id;

                        this.LoadReportsData(ID, currAsset, i);

                    }
                }
            }))
            .subscribe();


    }


    LoadReportsData(CSAsID: number, currAsset: string, tabIndex: number) {

        this.wb = XLSX.utils.book_new();

            var indata = {
                'CSID': this.CSID,
                'CSAsID': CSAsID,
                'StartDate': this.StartDate,
                'EndDate': this.EndDate,
                'PRsDelimitedList': this.PRsDelimitedList

            }
            this._reportingService.getProjectReportsData(indata).pipe(
                map(result => {

                        this.reportData = result;

                        this.idx = this.idx + 1;

                        if (this.reportData != null) {
                            this.ws = this.ws + '_' + tabIndex.toString();
                            this.ws = XLSX.utils.json_to_sheet(this.reportData);
                            XLSX.utils.book_append_sheet(this.wb, this.ws, currAsset);
                            console.log(currAsset);
                        }
                        if (this.ProjReqSubmissionReportingAssets.length == this.idx) {
                            var currDateTime = this.fn_getTimeStamp();
                            XLSX.writeFile(this.wb, "ProjReport_" + this.HCs + "_" + currDateTime + ".xlsx");
                        }

                }))
            .subscribe();

            this._reportingService.isLoading = false;

}

Answer 1

Вместо того чтобы выполнять вызовы API внутри цикла, вы можете создать массив всех из них и combineLatest их всех.Тогда подписчик в конечном итоге получит данные в правильном порядке.

Как правило, примерно так:

    this._reportingService.getProjSubRptAssets(fetchAssetData).pipe(
        filter(result => result !== null),
        map(result => result.map(
            curAsset => this.LoadReportsData(curAsset.id, curAsset, i)
        )),
        switchMap(requestsArray => combineLatest(requestsArray))
    ).subscribe(
        resultArray => {
            // resultArray should consist responses of API calls in the same order
            // the results getProjSubRptAssets(fetchAssetData) came in
        })