Ответ показывает undefined в angular при подписке на наблюдаемые - PullRequest
Новая
       9

Ответ показывает undefined в angular при подписке на наблюдаемые

0 голосов
/ 10 июля 2020

У меня есть метод get, который извлекает данные из некоторого Api, и приходит ответ (я получил эти JSON данные с помощью почтальона): 

{
    "content": [
        {
            "order_id": 6,
            "todayDate": "2020-07-04T15:09:40.556+0000",
            "status": "pending"
        },
        {
            "order_id": 7,
            "todayDate": "2020-07-04T15:13:16.464+0000",
            "status": "pending"
        },
        {
            "order_id": 8,
            "todayDate": "2020-07-05T13:41:13.337+0000",
            "status": "pending"
        },
        {
            "order_id": 9,
            "todayDate": "2020-07-05T13:58:21.771+0000",
            "status": "pending"
        },
        {
            "order_id": 10,
            "todayDate": "2020-07-05T14:03:07.791+0000",
            "status": "pending"
        }
    ],
    "pageable": {
        "sort": {
            "sorted": false,
            "unsorted": true,
            "empty": true
        },
        "offset": 5,
        "pageSize": 5,
        "pageNumber": 1,
        "paged": true,
        "unpaged": false
    },
    "totalElements": 39,
    "totalPages": 8,
    "last": false,
    "size": 5,
    "number": 1,
    "sort": {
        "sorted": false,
        "unsorted": true,
        "empty": true
    },
    "numberOfElements": 5,
    "first": false,
    "empty": false
}

Итак, обычно при получении ответа от AJAX, Раньше делал, console.log(res.content) и дает мне правильный список заказов. Но в моем классе обслуживания в angular 9 я использовал интерфейс для сопоставления ответа, но он не работает. 

import { Injectable } from '@angular/core';
import { CartItem } from '../common/cart-item';
import { Subject, Observable } from 'rxjs';
import { Order } from '../common/order';
import { HttpClient } from '@angular/common/http';
import { map } from 'rxjs/operators';


@Injectable({
  providedIn: 'root'
})
export class CartService {

  private baseUrl="http://localhost:8080/api/test";

  constructor(private httpClient:HttpClient) { }


  getOrderDetails():Observable<Order[]>{
    const orderUrl=`${this.baseUrl}`+'/getAllPendingOrders';
    return  this.httpClient.get<GetResponseOrder>(orderUrl).pipe(
      map(response => response.content.orders)
       );
  }
  
}
interface GetResponseOrder {
  content :{
     orders :Order[];
    }
}

И я подписался на myorder.component.ts как: 

  ngOnInit(): void {
    this._cartService.getOrderDetails().subscribe((res) =>{
       console.log(res);
           
    }); 
  }

Но на своей консоли я вижу undefined, пытаясь увидеть ответ. Итак, мой Order.ts файл: 

export class Order {
 
    order_id:Number;
     todayDate:Date;
    status:String;
}

1 Ответ

3 голосов
/ 10 июля 2020

Что касается вашего ответа, я думаю, это должно быть 

getOrderDetails():Observable<Order[]>{
 const orderUrl=`${this.baseUrl}`+'/getAllPendingOrders';
 return  this.httpClient.get<GetResponseOrder>(orderUrl).pipe(
   map(response => response.content)
   );
}

содержимое представляет собой массив, я не вижу заказов, ваш интерфейс становится 

interface GetResponseOrder {
 content : Order[];
}
...