Lab 9: Observables

Objectives

• Make use of the ActivatedRoute service to read the parameters of the URL using observables

Instructions

• We want in our album-detail.component.ts to have a previous album and next album button
• Clicking on those buttons should redirect to the previous or next album using navigateByUrl the Router
• To do so, we need to read the id parameter of the URL in a reactive way
• Instead of using a snapshot, we will use the ActivatedRoute service to subscribe to the changes of the parameter

route = inject(ActivatedRoute);

Then later in the code

this.route.params.subscribe(params => {
  console.log(params['id']);
});

• We don’t want to manage the use case of when next or previous album does not exist, we will let the user go to the HomeComponent if that happens

TODO: Make the slide mode detailed about steps