So I am wondering what is the best way to pass data retrivied from an API endpoint to another component without requesting data again? So from what I can understand I can do this with a Service shared between the two components but when should I store data in the service? And what are the best practices in this case?
If you need to share data beetwen multiple components you should use a service, as you already said.
But you should not store the data inside the components. The service should be in charge of requesting and storing the data.
Each component will request the data to the service. The service will execute the actual HTTP call or return the data from its local cache. For this to work, ensure you have a single instance of the service (ie in app.module register it in the providers section).