How to pipe / map an Observable in Angular

Question

A nested object is showing up as [object Object] so I\'m trying to cast it via pipe and map but I\'m not getting any where. I\'ve tried the models as classes and interfaces

Answer 1

1) remove the piping part from your getClients() method

2) do the pipe-map before subscribing to getClients() or create another method, that will do only the piping part with the observable returned from getClients()

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

This is important to understand: when you call .map() method inside .pipe(), you're not getting a single client in this case, you get the whole clients array, pushed to Observable. Because you map the values, that are stored in the Observable - the values of type: < Client[] >.

Your pipe-map would work on some Observable, that emits a single client of type < Client >, not an array.

Answer 2

The problem is here:

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

you requested the function to return in form of observable (array of client) but actually you are returning Observable of Address.

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

That's why the function is throwing this error. Replace Observable<Client[]> with Observable<Address[]>