I'm exploring Angular. I'm trying some basic concepts like routing, Observables (and subscribing to them), making HTTP requests and routing parameters. I've created a very basic scenario where I'm making a HTTP GET request to JSONPlaceholder to fetch all albums. I've created a service for this. I've added:

```
<a [routerLink]="['albums', album.id]">{{album.title}}</a>

```

to album title, when I click on a title I should be routed to the detail view of that particular album. I'll show you my code also, but I think a [stackblitz](https://stackblitz.com/edit/angular-czmhca) will be more meaningful. Here's the code:

**album-detail.component.ts**

```
import { Component } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { AlbumService } from './albums.service';
import { IAlbum } from './album';

@Component({
  template: './album-detail.component.html'
})
export class AlbumDetailComponent {

  album: IAlbum;

  constructor(private _route: ActivatedRoute, private _albumService: AlbumService) {}

  ngOnInit(): void {
    const id=+this._route.snapshot.paramMap.get('id');
    console.log("called for: "+id);
    this.getAlbumById(id);
  }

  getAlbumById(id: number) {
    this._albumService.getAlbumById(id).subscribe({
      next: album => this.onAlbumRetrieved(album)
    })
  }

  onAlbumRetrieved(album: IAlbum): void {
    this.album = album;
  }
}

```

**album.module.ts**

```
import { NgModule } from '@angular/core';
import { AlbumListComponent } from './albums-list.component';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule } from '@angular/router';
import { HttpClientModule } from '@angular/common/http';
import { AlbumDetailComponent } from './album-detail.component';

@NgModule({
  imports: [
    BrowserModule,
    HttpClientModule,
    RouterModule.forChild([
      {path: 'albums', component: AlbumListComponent},
      {path: 'albums/:id', component: AlbumDetailComponent},
    ])
  ],
  declarations: [ 
    AlbumListComponent,
    AlbumDetailComponent
  ]
})
export class AlbumModule { }

```

My get request is also successful but there's something wrong with my routing:

[![Screenshot of Mozilla DevTools with errors](https://i.stack.imgur.com/nkRK2.png)](https://i.stack.imgur.com/nkRK2.png)