diff --git a/src/app/components/artists/artists.component.html b/src/app/components/artists/artists.component.html
index 1990e0a..1691988 100644
--- a/src/app/components/artists/artists.component.html
+++ b/src/app/components/artists/artists.component.html
@@ -10,16 +10,23 @@
- {{ artistData.name }}'s profile
+
-
+
{{ artistData.name }}'s profile
-
{{ artistData.name }}'s songs
+
-
+
{{ artistData.name }}'s albums
+
+
+
{{ artistData.name }}'s songs
+
+
+
+
diff --git a/src/app/components/artists/artists.component.ts b/src/app/components/artists/artists.component.ts
index 0ac572e..8136ad8 100644
--- a/src/app/components/artists/artists.component.ts
+++ b/src/app/components/artists/artists.component.ts
@@ -1,7 +1,7 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { ApiService } from 'src/app/services/api.service';
-import { Artist, Song } from '../../classes/entities';
+import { Artist, Song, Album } from '../../classes/entities';
@Component({
selector: 'app-artists',
@@ -13,6 +13,7 @@ export class ArtistsComponent implements OnInit {
artistData: Artist;
artists: Promise>;
songs: Array;
+ albums: Array;
constructor(
private api: ApiService,
@@ -29,7 +30,10 @@ export class ArtistsComponent implements OnInit {
// ... then get artist data ...
this.api.getArtist(Number(params.get('id'))).then(async res => {
this.artistData = res;
- this.songs = await this.api.getSong(res.songs.join());
+ const songs = await this.api.getSong(res.songs.join());
+ this.songs = songs.length ? songs : [songs];
+ const albums = await this.api.getAlbum(res.albums.join());
+ this.albums = albums.length ? albums : [albums];
});
} else {