组件内的Angular 4调用HttpResponse

Question

我正在尝试从我的帖子中获取角度为 4 的响应。这是我的代码：

app.component.html：

`findAccordiSmall(pagination: Pagination) {
        this.accordiListTableLoading = true;
        debugger;
        this.accordiService.findAccordiSmall(pagination).subscribe(
          (res: HttpResponse<any>) => {
            res.headers.get('offset');
            res.headers.get('count');

            this.agreementList= res.body;

          }      errors => {
        this.accordiListTableLoading = false;
        Utils.notifyErrors(errors, this.notificationsService);
      }
    );

服务.ts

findAccordiSmall(pagination: Pagination): Observable<HttpResponse<any>> {

    const queryParams = this.getHttpParams(pagination).toString();

    return this.http.post(`${this.ENDPOINT}/agreements-paginated?${queryParams}`,pagination, { observe: 'response' })
        .catch(error => Utils.handleError(error, this.router, 'Errore nel recupero delle pratiche'));
}

POST 正在向我发送我想要的所有数据（标题、响应等），但我无法在我的组件中使用这些值。我怎么称呼他们？ 我必须填写： agreementList: Agreement[]; 回复。

抱歉，如果您需要更多信息，请告诉我。

编辑：This is my response

编辑2：

组件.ts

  findAccordiSmall(pagination: Pagination) {
    this.accordiListTableLoading = true;
    this.accordiService.findAccordiSmall(pagination).subscribe(
      (res: Agreement[]) => {
        this.agreementList= res;
      },
  errors => {
    this.accordiListTableLoading = false;
    Utils.notifyErrors(errors, this.notificationsService);
  }
);

service.ts

 findAccordiSmall(pagination: Pagination): Observable<Agreement[]> {

        const queryParams = this.getHttpParams(pagination).toString();
        debugger;
        return this.http.post<Agreement[]>(`${this.ENDPOINT}/agreements-paginated?${queryParams}`,pagination, { observe: 'response' })
            .map(res => res)
            .catch(error => Utils.handleError(error, this.router, 'Errore nel recupero delle pratiche'));}

Answer 1

如果您需要用响应填充agreementList: Agreement[]，您只需将res（服务函数返回的值）分配给它。无需使用res.body。 你有this.agreementList= res.body;。这是错误的。 此行应为this.agreementList = res;

编辑：更新的组件代码：

findAccordiSmall(pagination: Pagination) {
    this.accordiListTableLoading = true;
    debugger;
    this.accordiService.findAccordiSmall(pagination).subscribe(
      (res: Agreement[]) => {
        this.accordiListTableLoading = false;
        this.agreementList= res;
      },
  errors => {
    this.accordiListTableLoading = false;
    Utils.notifyErrors(errors, this.notificationsService);
  }
);

我用正确的返回值更新了你的服务函数，你还需要map 。

findAccordiSmall(pagination: Pagination): Observable<Agreement[]> {

const queryParams = this.getHttpParams(pagination).toString();

return this.http.post<Agreement[]>(`${this.ENDPOINT}/agreements-paginated?${queryParams}`,pagination, { observe: 'response' })
    .map(res => res)
    .catch(error => Utils.handleError(error, this.router, 'Errore nel recupero delle pratiche'));

}

所以现在它返回Observable<Agreement[]>，这意味着当您订阅它时，订阅中的res 将从Observable, and it's type will beAgreement[]` 中解包出来

subscribe((res: Agreement[]) => {})