如何在 Angular 8 中操作 GET 响应?

Question

我有一个.Net核心API：

var response = new
{
Data = data,
TotalPages = totalPages
};
return Ok(response);
}

数据是订单数的IEnumerable，总页数是整数。 我想在我的 Angular 应用程序中给出此响应，所以我有一个服务

interface Response {
totalPages: number;
data: any;
}
@Injectable({
providedIn: 'root'
})
export class OrderDataService {
constructor(private http: HttpClient) {}
getOrder(pageNumber: number, pageSize: number): Observable<any> {
return this.http.get<Response>('http://localhost:5001/api/order/' + pageNumber + '/' + pageSize).pipe(
map(res => res ),
);
}
}

我的组件如下所示：

constructor(private orderData: OrderDataService) { }
orders: Order [];
page = 1;
pageSize = 10;
total = 0;
ngOnInit() {
this.getOrders();
}
getOrders(): void {
this.orderData.getOrder(this.page, this.pageSize)
.subscribe(res => {
this.orders = X;
this.total = Y;
});
}

我希望 this.orders 包含响应的数据部分，而 this.total 包含 totalPages。

Answer 1

您已经有了答案，只需在订阅中分配它：

this.order = res.data;
this.total = res.totalPages;

还可以尝试在最佳利用类型下使用打字稿，您可以将 getOrder 的返回类型更改为Observable<Response>。

同时将接口声明更改为：

interface Response {
totalPages: number;
data: Order[];
}

我也无法理解getOrder函数中地图的目的，我认为它应该看起来像这样：

return this.http.get<Response>(`http://localhost:5001/api/order/${pageNumber}/${pageSize});