Angular 2+ how to share same ajax response with multiple components

Create a service like above.
The line

import shareReplay  from rxjs

import { share, shareReplay } from 'rxjs/internal/operators'; 

this.profileObservable =

this.http.get(environment.APIEndpoint + 'userProfile').pipe(shareReplay());

create a shareable HTTP Observable. This can used by any component to get the response.

Only one ajax request will trigger for all the request to this service.