Подождите, пока несколько rxjs наблюдаются внутри foreach, пока не завершите выполнение другого - PullRequest
Новая
       17

Подождите, пока несколько rxjs наблюдаются внутри foreach, пока не завершите выполнение другого

0 голосов
/ 30 октября 2019
  • Я хочу выполнить цикл по значениям selected_checkboxes.
  • foreach Я хочу сделать запрос POST.
  • Затем, когда все запросы POST внутри foreach были выполнены, я хочуПОЛУЧИТЕ только что запрошенные данные.

Проблема:

  • моя функция get отделена от моей функции post, поэтому запрос на публикацию не завершился ион делает get, поэтому он возвращает пустое значение get, потому что сообщение еще не опубликовано.

Решение:

добавьте наблюдаемые в массив, а затемпоместите их в forkJoin в конце foreach.

То, что я видел возможным:

  • преобразуйте наблюдаемое в обещание и затем используйте асинхронное ожидание,не очень удобно с этим
  • может использовать операторы forkJoin для выполнения некоторых наблюдаемых и ждать, пока все они будут сделаны.

Мой API-сервис возвращает наблюдаемые значения RxJ, я нахожусь в Angular 8 и здесьэто две функции: во-первых, AddVacation (), который будет POSTнекоторые данные, а затем getAgentsInSfihtDispo () получит отправленные данные. 

addVacation() {
    let counter = 0;
    const shift_id = this.selectedShiftForMaincouranteModify;
    const shift_date = this.modifyForm.value.dateDeb.format('YYYY-MM-DD');
    this.api.sendGetRequest("/api/shift_dates/" + shift_date, true, null, null)
        .subscribe((data) => {
            this.agents_dispo_checked.forEach((agent) => {
                const agent_id = agent.id;
                if (data) {
                    this.api.sendPostRequest('/api/shift_dos', true, null,
                        { shift_id: shift_id, shift_date: shift_date, agent_id: agent_id })
                        .subscribe();
                } else {
                    this.api.sendPostRequest("/api/shift_dates", true, null, { date: shift_date })
                        .subscribe((data3) => {
                            if (data3.error === "L'association existe deja dans la base de données") {
                                this.api.sendPostRequest('/api/shift_dos', true, null,
                                    { shift_id: shift_id, shift_date: shift_date, agent_id: agent_id })
                                    .subscribe();
                            } else {
                                this.api.sendPostRequest('/api/shift_dos', true, null,
                                    { shift_id: shift_id, shift_date: data3.date, agent_id: agent_id })
                                    .subscribe();
                            }
                        });
                }
                counter++;
            });
            if (this.agents_dispo_checked.length === counter) {
                this.isOpenSaisieVacation = false;
                this.getAgentsInShiftAndDispo();
            }
        },
    (err) => console.error(err));
}

getAgentsInShiftAndDispo() {
    this.agentsInShift = [];
    this.agents_dispo = [];
    this.agentsInShiftSelectedFormArray.clear();
    this.agentsDispoFormArray.clear();
    if (this.selectedShiftForMaincouranteModify !== 0 &&
        (this.modifyForm.controls.dateDeb.value !== "" || this.modifyForm.controls.dateDeb.value !== null || this.modifyForm.controls.dateDeb.value !== undefined)) {
        const shift_id = this.selectedShiftForMaincouranteModify;
        const goodFormatDate = this.modifyForm.value.dateDeb.format('YYYY-MM-DD');
        this.api.sendGetRequest('/api/shift_dos/byShiftAndDate/' + shift_id + "/" + goodFormatDate, true, null, null)
            .subscribe((data) => {
                if (data) {
                    data.forEach((item) => {
                        this.agentsInShift.push(item.agent);
                    });
                }
            }, (err) => console.error(err),
            () => {
                this.agentsInShift.map((o, i) => {
                    const control = new FormControl(true); // if first item set to true, else false
                    this.agentsInShiftSelectedFormArray.push(control);
                });
                const difference = this.agentsMaintenance.filter((obj) => {
                    return !this.agentsInShift.some((obj2) => {
                        return obj.id === obj2.id;
                    });
                });
                this.agents_dispo = difference;
                this.agents_dispo.map((o, i) => {
                    const control = new FormControl(false); // if first item set to true, else false
                    this.agentsDispoFormArray.push(control);
                });
            });
    }
}

Заранее спасибо, чтобы направить меня в большой мир операторов RxJs.

1 Ответ

1 голос
/ 30 октября 2019

Вам нужно будет поместить все наблюдаемые в массив и использовать forkJoin. 

private observables = [];

addVacation() {
    let counter = 0;
    const shift_id = this.selectedShiftForMaincouranteModify;
    const shift_date = this.modifyForm.value.dateDeb.format('YYYY-MM-DD');
    this.api.sendGetRequest("/api/shift_dates/" + shift_date, true, null, null)
        .subscribe((data) => {
            this.agents_dispo_checked.forEach((agent) => {
                const agent_id = agent.id;
                if (data) {
                    this.observables.push(this.api.sendPostRequest('/api/shift_dos', true, null,
                        { shift_id: shift_id, shift_date: shift_date, agent_id: agent_id }));
                } else {
                    this.observables.push(this.api.sendPostRequest("/api/shift_dates", true, null, { date: shift_date })
                        .subscribe((data3) => {
                            if (data3.error === "L'association existe deja dans la base de données") {
                                this.observables.push(this.api.sendPostRequest('/api/shift_dos', true, null,
                                    { shift_id: shift_id, shift_date: shift_date, agent_id: agent_id }));
                            } else {
                                this.observables.push(this.api.sendPostRequest('/api/shift_dos', true, null,
                                    { shift_id: shift_id, shift_date: data3.date, agent_id: agent_id }));
                            }
                        });
                }
                counter++;
            });
            if (this.agents_dispo_checked.length === counter) {
                this.isOpenSaisieVacation = false;
                forkJoin(this.observables)
                  .subscribe(val => this.getAgentsInShiftAndDispo());
            }
        },
    (err) => console.error(err));
}

getAgentsInShiftAndDispo() {
    this.agentsInShift = [];
    this.agents_dispo = [];
    this.agentsInShiftSelectedFormArray.clear();
    this.agentsDispoFormArray.clear();
    if (this.selectedShiftForMaincouranteModify !== 0 &&
        (this.modifyForm.controls.dateDeb.value !== "" || this.modifyForm.controls.dateDeb.value !== null || this.modifyForm.controls.dateDeb.value !== undefined)) {
        const shift_id = this.selectedShiftForMaincouranteModify;
        const goodFormatDate = this.modifyForm.value.dateDeb.format('YYYY-MM-DD');
        this.api.sendGetRequest('/api/shift_dos/byShiftAndDate/' + shift_id + "/" + goodFormatDate, true, null, null)
            .subscribe((data) => {
                if (data) {
                    data.forEach((item) => {
                        this.agentsInShift.push(item.agent);
                    });
                }
            }, (err) => console.error(err),
            () => {
                this.agentsInShift.map((o, i) => {
                    const control = new FormControl(true); // if first item set to true, else false
                    this.agentsInShiftSelectedFormArray.push(control);
                });
                const difference = this.agentsMaintenance.filter((obj) => {
                    return !this.agentsInShift.some((obj2) => {
                        return obj.id === obj2.id;
                    });
                });
                this.agents_dispo = difference;
                this.agents_dispo.map((o, i) => {
                    const control = new FormControl(false); // if first item set to true, else false
                    this.agentsDispoFormArray.push(control);
                });
            });
    }
}
...