Angular 6 rxjs 6 return Observable nested element

Question

I would like to return a child element of an observable as this.

Say I have a HttpClient that gets an observable of people:

export class People{

    public Name: string;
}

and a service that gets a single one as abservable:

public get(id: number): Observable<People> {
    return this.http.get<People>('http://localhost:8801/' + "people/" + id);
  }

Now I would like to get the name from my observable as observable:

public get(id: number): Observable<string>{
    this.peopleService.get(id) .... ?
}

How could this be done?

Valeriy Katkov · Accepted Answer · 2018-08-30 06:37:18Z

1

You can use map() function to transform people observable:

const nameObservable = this.peopleService.get(id).pipe(
    map(people => people.name)
);

answered Aug 30, 2018 at 6:37

Valeriy Katkov

41.8k27 gold badges110 silver badges135 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sachila Ranawaka · Accepted Answer · 2018-08-30 06:30:55Z

0

subscribe to the event

  this.peopleService.get(id).subscribe((item) => {
   console.log(item.name)
 })

answered Aug 30, 2018 at 6:30

Sachila Ranawaka

41.6k8 gold badges62 silver badges87 bronze badges

No I don't want to get the name I want to return the name as a Observable<string>. In specific I would like to bind async to the name property.