Angular http получить с asyn c жду - PullRequest
Новая
       1

Angular http получить с asyn c жду

0 голосов
/ 22 апреля 2020

В моем служебном компоненте есть следующий код, который получает данные из API: 

async getIngredientsByProductSubCategory(productSubCategoryId: number) {
    const url = '/my-url';
    let dataToReturn: any;
    await this.http.get(url).toPromise()
        .then(data => {
            console.log(data);
            dataToReturn = data;
        });
    return dataToReturn;
}

Проблема в том, что приведенный выше файл console.log выводит правильные данные, но когда я выполняю их из другой компонент, подобный этому: 

this.myService.getIngredientsByProductSubCategory(4);

я получаю этот вывод из моего console.log:

log data of type

Что мне нужно сделать, чтобы получить правильные данные в другом компоненте? Должен ли я решить эту проблему каким-либо образом?

ОБНОВЛЕНИЕ:

Рабочее решение для меня:

Служба: 

getIngredientsByProductSubCategory(productSubCategoryId: number) {
    const url = '/my-url';
    return this.http.get(url).toPromise();
}

Компонент: 

async getIngredients() {
    const ingredientsByProductSubCategory = await this.frontendService.getIngredientsByProductSubCategory(4);
}

Также я прочитал, что если у вас нет требования использовать повторяющиеся данные, вы не можете использовать Observables.

Спасибо всем за вашу помощь!

Ответы [ 2 ]

1 голос
/ 22 апреля 2020

Поскольку вы объявляете getIngredientsByProductSubCategory как asyn c, автоматически этот метод возвращает Promise, поэтому все async, await или then здесь избыточны. Мы можем просто написать: 

getIngredientsByProductSubCategory(productSubCategoryId: number) {
    const url = '/my-url';
    return this.http.get(url).toPromise();
}

и потреблять это: 

const ingredientsByProductSubCategory = await getIngredientsByProductSubCategory(someId);
0 голосов
/ 22 апреля 2020

Вы можете вернуть наблюдаемые вместо данных. Мое решение: 

    getIngredientsByProductSubCategory(productSubCategoryId: number) {
      const url = '/my-url';
      return this.http.get(url);
}

Для получения данных необходимо подписаться на наблюдаемые: 

getIngredientsByProductSubCategory(4)
   .subscribe((data) => { dataToReturn = data; });
...