Служба Angular 5 возвращает данные из API, но компонент не показывает мне данные

Question

Служба Angular 5 возвращает данные из API, но компонент не показывает мне данные

1

Большая часть этого материала в Angular 5 с машинописными текстами и rxjs с наблюдаемыми довольно похожа на угловые 2, 4, но у меня, похоже, возникают проблемы с пониманием ПОЧЕМУ мой код компонента не показывает данные.

Вот мой код

модель:

export class arsCodes {
  iD: number;   
  aRSCode: string;
  aRSDescription: string;
  class: string;
  victimFlag: string;
  startDate: string;
  endDate: string;
  createdByUserID: string;
  createdOnDateTime: string;
  modifiedByUserID: string;
  modifiedOnDateTime: string;
}

Рабочее обслуживание

const httpOptions = {
  headers: new HttpHeaders({ 'Content-Type': 'application/json' })
};

getArsCodesApi(search: arsCodes) {
  return this.http.post(this.serviceUrl, JSON.stringify(search), httpOptions)
    .map((response: Response) => {
      response;
      console.log(response) // WORKS
    })
}

"Ответ" в console.log выше возвращает {Status: "success", Message: "", data: Array (16)}

затем

 data: Array(16) 
 >0: {ID: 4443, ..... }  
 //etc..

Однако в моем вызове из файла Component в подписке указано, что он не определен

arsCode: ArsCode[];

this.arsSevice.getArsCodesApi(this.model).subscribe(
  result => {
    //this.arsCode = result
    console.log(result);
  },
  error => {
    console.log(error);
  }
)

Что мне нужно сделать в моем компоненте для извлечения данных?

Scott Leary 01 дек. 2017, в 01:34

Источник

Теги:

angular

javascript

rxjs

observable

2 ответа

1

Вы возвращаете функцию карты. Включите этот код в ходатайстве http для возврата данных:

return this.http.post(this.serviceUrl, JSON.stringify(search), httpOptions)
    .map(this.extractData)
    .catch(this.handleError);

Извлечение из простых данных - это простой возврат:

private extractData(res: Response): Observable<any> {
    return res|| { };
  }

Используйте return res.json для данных JSON. Вы также можете использовать это для управления ошибками:

 private handleError(error: any){
    return Observable.throw("Data unavailable or incorrect url");
  }

alvaropanizo 30 нояб. 2017, в 23:04

0

Я получаю ошибку в этой строке return res || {};
Scott Leary 01 дек. 2017, в 00:18
0

Пожалуйста, вставьте ошибку.
alvaropanizo 01 дек. 2017, в 00:21

Ещё вопросы

Я получаю ошибку в этой строке return res || {};

Sonicd300 · Accepted Answer · 2017-11-30T22-47-00.000Z

Проблема в том, что вы ничего не возвращаете в функции.map() вашей службы (которая с помощью HttpClient не требуется)

Но в любом случае вам нужно вернуться так:

return this.http.post(this.serviceUrl, JSON.stringify(search), httpOptions)
  .map((response: Response) => {
    console.log(response);
    return response;
  });

Теперь не нравится строка console.log console.log (ответ)