Autoload when reach bottom

dashboard/src/app/album.component.html

@@ -37,7 +37,7 @@
 </tbody>
 </table>
 
-<button type="button" *ngIf="more" class="btn btn-default" aria-label="More" (click)="loadSongs()">
+<button type="button" *ngIf="more" class="btn btn-default" aria-label="More" (click)="loadSongs()" (window:scroll)="onScroll($event)">
     <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> More...
 </button>
 

dashboard/src/app/album.component.ts

@@ -57,4 +57,10 @@ export class AlbumComponent implements OnInit {
   scrollTop(): void {
     window.scrollTo(0,0);
   }
+
+  onScroll(event: any) {
+    if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
+        this.loadSongs();
+    }
+  }
 }