How to pipe / map an Observable in Angular
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[]>
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.