javascript - Angular 5 服务从 api 返回数据，但组件没有向我显示数据

Question

Angular 5 中带有 typescript 和带有 observables 的 rxjs 的大部分内容与 angular 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 中的“response”返回 { Status: "success", Message: "", data: Array(16) }

然后

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

但是，在我从订阅中的组件文件调用时，它是未定义

arsCode: ArsCode[];

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

我需要在我的组件中做什么来检索数据？

Answer 1

问题是您没有在服务的 .map() 函数中返回任何内容(不需要使用 HttpClient)

但无论如何，你必须这样返回:

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