fix: song details

.gitignore

@@ -264,4 +264,7 @@ __pycache__/
 */*/App_Data/*
 
 # Mac
-.DS_Store
+.DS_Store
+
+# Angular
+dist

WEB/src/app/components/song/song.component.html

@@ -6,10 +6,10 @@
       </button>
     </div>
     <mat-card-title>{{ song.Name }}</mat-card-title>
-    <mat-card-subtitle>{{ song.Key }} - {{ song.Velocity }}</mat-card-subtitle>
+    <mat-card-subtitle>{{ song.Key }} - {{ song.Tempo }}</mat-card-subtitle>
   </mat-card-header>
   <mat-card-content>
-    <p>{{ song.Text }}</p>
+    <p *ngFor="let line of text">{{ line }}</p>
   </mat-card-content>
   <mat-card-actions>
     <button mat-button (click)="onClickDownload()">Herunterladen</button>

WEB/src/app/components/song/song.component.ts

@@ -1,13 +1,13 @@
-import { DownloadService } from './../../data/download.service';
-import { Component, OnInit } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
-import { faLongArrowAltLeft } from '@fortawesome/free-solid-svg-icons';
-import { Song } from 'src/app/models/song.model';
+import { DownloadService } from "./../../data/download.service";
+import { Component, OnInit } from "@angular/core";
+import { ActivatedRoute } from "@angular/router";
+import { faLongArrowAltLeft } from "@fortawesome/free-solid-svg-icons";
+import { Song } from "src/app/models/song.model";
 
 @Component({
-  selector: 'app-song',
-  templateUrl: './song.component.html',
-  styleUrls: ['./song.component.less']
+  selector: "app-song",
+  templateUrl: "./song.component.html",
+  styleUrls: ["./song.component.less"]
 })
 export class SongComponent implements OnInit {
   public song: Song;
@@ -28,4 +28,8 @@ export class SongComponent implements OnInit {
     const id = this.song.ID;
     this.downloadService.get(id, false);
   }
+
+  public get text(): string[] {
+    return this.song.Text.split(/\r?\n/).filter(_ => _ !== ' ');
+  }
 }