如何在 Angular 中传输/映射 Observable

Question

一个嵌套对象显示为 [object Object]，因此我试图通过管道和映射将其投射，但我没有得到任何结果。我已经尝试将模型作为类和接口，但没有帮助。有人可以告诉我我做错了什么吗？谢谢

函数：

  getClients(customerId: number): Observable<Client[]> {
    let clientUrl = 'SOME_URL';
    return this.http.get<Client[]>(clientUrl)
      .pipe(map(client: Client) => client.address as Address);
  }

模特：

import { Address } from './address.model';

export class Client{
  id: number;
  name: string;
  accountNumber: string;
  addressId: number;
  phoneNumber: string;
  address: Address;
}


export class Address{
  id: number;
  name: string;
  addressLine1: string;
  addressLine2: string;
  city: string;
  postalCode: string;
}

我遇到错误：错误 TS2345 (TS) 'Address' 类型的参数不可分配给 'OperatorFunction<{}, Client[]>'.

类型的参数

Answer 1

问题在这里：

getClients(customerId: number): Observable<Client[]> {

您请求函数 return 以可观察的形式（客户端数组）但实际上您是 returning Observable of Address。

.pipe(map(client: Client) => client.address as Address);

这就是函数抛出此错误的原因。将 Observable<Client[]> 替换为 Observable<Address[]>

Answer 2

1) 从您的 getClients() 方法中删除管道部分

2) 在订阅 getClients() 之前执行管道映射或创建另一种方法，该方法将仅使用从 getClients()

返回的可观察对象执行管道部分

mapToAddress(): Observable<Address[]> {
  this.getClients.pipe(
    map((clients: Client[]) => clients.map(client => client.address))
  )
}

理解这一点很重要：当您在 .pipe() 中调用 .map() 方法时，在这种情况下您不会获得单个客户端，您会获得整个客户端数组，并将其推送到 Observable。因为您映射存储在 Observable 中的值 - 类型的值：。

你的 pipe-map 可以在一些 Observable 上工作，它发出一个类型的客户端，而不是一个数组。

如何在 Angular 中传输/映射 Observable

How to pipe / map an Observable in Angular

typescript

angular

angular7