Проблема 6 HttpClient Angular с отображением ответа от вызова API - PullRequest
Новая
       8

Проблема 6 HttpClient Angular с отображением ответа от вызова API

0 голосов
/ 10 сентября 2018

Мне нужна небольшая помощь относительно Angular 6 HttpClient.У меня проблема с ответом на вызовы REST API.Я использую HttpClient.У меня есть функция, которая выбирает список всех пользователей (в моем случае я называю это ведет). 

fetchLeadsList(){
  return this.http.get('http://localhost:3000/api/leads')
                  .pipe(
                     map(data => {
                        console.log(data);
                        return data;          
                     }));
}

В OnInit моего компонента, я называю эту конечную точку как: 

this.leadsService.fetchLeadsList()
                 .subscribe(response => {
                    console.log(response, 'leadsList');
                    this.leadsList = response.data; // leadList is declared as an empty array 
                 });

Я получаю список интересов следующим образом: enter image description here

Однако, когда я пытаюсь отобразить ответ от службы, как упомянуто в компоненте выше (this.leadsList = response.data), я получаю сообщение об ошибке:

ОШИБКА TS2339: Свойство «данные» не существует для типа «Объект».

, поскольку, есть свойство data, как показано на рисунке, почему оно выдает ошибку?

И я также могу отобразить список в виде!Что-то мне не хватает?

Ответы [ 3 ]

0 голосов
/ 10 сентября 2018

Метод HttpClient.get () проанализировал ответ сервера JSON в анонимный тип объекта. Он не знает, какова форма этого объекта.

Вы можете указать, к какой модели вы хотите привести результат: 

fetchLeadsList() {
    return this.http.get<{ data: any[] }>('http://localhost:3000/api/leads')
                         ^^^^^^^^^^^^^

Смотри также:

0 голосов
/ 10 сентября 2018

попробуйте получить доступ как ответ ['data'] надеюсь, что это решит вашу проблему

Happy Coding:)

0 голосов
/ 10 сентября 2018

Вы должны сообщить компилятору, какой тип response имеет. Вы можете создать для него тип или просто установить его на any, чтобы компилятор мог передать ваш код 

this.leadsService.fetchLeadsList()
    .subscribe((response: any) => {
      console.log(response, 'leadsList');
      this.leadsList = response.data; // leadList is declared as an empty array
})
...