Угловые API-запросы - PullRequest
Новая
       8

Угловые API-запросы

0 голосов
/ 19 марта 2019

Как вызвать этот метод по порядку?

У меня есть 2 услуги 

getFirstDropdown() {
        return this.http.get<any>(`/api/Entity/GetObjTypes`)
            .pipe(map(response => {
                return response;
            }));
    }

generateDropdown(id) {
    return this.http.get<any>(`/api/Entity/GetObjTypesbyID?Type=` + id)
        .pipe(map(response => {
            return response;
        }));
}

У меня есть 3 метода в компоненте 

takeDropdown(): void {
        this.administrationService.getFirstDropdown()
            .pipe(first())
            .subscribe(
                data => {
                    console.log(data);
                },
                error => {
                    console.log(error);
                });
}


generateDropdown(id): void {
        this.administrationService.generateDropdown(id)
            .pipe(first())
            .subscribe(
                data => {
                    console.log(data);
                },
                error => {
                    console.log(error);
                });
}

async getFirstDatas() {
    this.loading = true;
    await this.takeDropdown();
    await this.generateDropdown(25);
    this.loading = false;
}

В этом примере async и await мне не помогают. Я должен позвонить им по порядку.

1 Ответ

0 голосов
/ 19 марта 2019

Вау, первый и формость, успокойся, приятель.Чтобы ответить на ваш вопрос, вы можете использовать RxJs mergeMap для объединения вызовов API различных методов обслуживания!Это гарантирует, что они вызываются в определенном порядке, как написано в вашем исходном коде.Не забудьте импортировать mergeMap в ваш компонент. 

import { mergeMap } from 'rxjs/operators';
.
.
handleData(id) {
  this.administrationService.getFirstDropdown().pipe(
    mergeMap(() => this.administrationService.generateDropdown(id))
  ).subscribe(response => {
    console.log(response);
    this.loading = false; // set loading as false after returning the subscribed value
  }, error => {
    console.log(error);
  });
}

.
.
this.handleData(25)
...