fixed translations in list component

src/app/component/list/list.component.html

@@ -1,14 +1,18 @@
 <div *ngIf="isNear" class="container">
   <h1>
-    {{translations.locationName}}{{locationParams}}
+    {{translations.locationName}}: {{locationParams}}
   </h1>
-  <div *ngFor="let locations of locations, let i = index" class="row">
-    <h3>
-      <a class="link link-primary" href="location/{{locations.location}}">{{locations.location}}</a>
-    </h3>
-    <div>
-      <h4 *ngIf="locations.distance && !positionNotFound">{{translations.distance}}{{locations.distance}} km</h4>
-      <h4 *ngIf="positionNotFound">{{translations.positionNotFoundErrorMessage}}</h4>
+  <div class="container2">
+    <div class="left">
+      <div *ngFor="let locations of locations, let i = index" class="row">
+        <h3>
+          <a class="link link-primary" href="location/{{locations.location}}">{{locations.location}}</a>
+        </h3>
+        <div class="distance">
+          <h4 *ngIf="locations.distance && !positionNotFound">{{translations.distance}}{{locations.distance}} km</h4>
+          <h4 *ngIf="positionNotFound">{{translations.positionNotFoundErrorMessage}}</h4>
+        </div>
+      </div>
     </div>
   </div>
 </div>

src/app/component/list/list.component.ts

@@ -9,6 +9,7 @@ import {WaypointService} from "../../service/http/waypoint.service"
 import {cookieService} from "../../service/cookie.service";
 import {UserService} from "../../service/http/user.service";
 import {WaypointVisitedService} from "../../service/http/waypointVisited.service";
+import {ReadTranslateJsonService} from "../../service/language/readTranslateJson.service";
 
 @Component({
   selector: 'app-list',
@@ -42,10 +43,12 @@ export class ListComponent implements OnInit, OnChanges {
     private waypointVisitedService: WaypointVisitedService,
     private userService: UserService,
     private cookieService: cookieService,
+    private readTranslationJsonService: ReadTranslateJsonService,
   ) {
   }
 
   async ngOnInit() {
+    this.translations = this.readTranslationJsonService.getListTransaltions();
     this.username = this.cookieService.getUsername();
     this.route.params.subscribe(params => {
       this.locationParams = params['location'];

src/assets/i18n/list/en.json

@@ -1,6 +1,6 @@
 {
   "translate": "Translate",
-  "locationName": "Position not found: ",
-  "distance": "Distance: ",
+  "locationName": "Position not found",
+  "distance": "Distance",
   "positionNotFoundErrorMessage": "Could not retrieve position"
 }