Add the view to show the list of DZs

Front/skydivelogs-app/src/app/list-of-dzs/list-of-dzs.component.html

@@ -1,3 +1,11 @@
 <p>
   list-of-dzs works!
 </p>
+
+<table>
+  <tr *ngFor="let dropZone of userObservable | async as listOfDropZones; index as i;">
+    <td>{{ dropZone.Id }}</td>
+    <td>{{ dropZone.Name }}</td>
+  </tr>
+
+</table>

Front/skydivelogs-app/src/app/list-of-dzs/list-of-dzs.component.ts

@@ -12,16 +12,15 @@ import { ServiceApi } from '../../services/serviceApi';
 export class ListOfDzsComponent implements OnInit {
   public listOfDropZones: Array<DropZoneResp>;
 
-  constructor(private serviceApi: ServiceApi) { }
+  constructor(private serviceApi: ServiceApi) {
+  }
 
   ngOnInit() {
+    this.getListOfDropZones();
   }
 
   getListOfDropZones() {
     this.serviceApi.getListOfDropZones()
-    .subscribe((data: DropZoneResp) => this.listOfDropZones = {
-        heroesUrl: data['heroesUrl'],
-        textfile:  data['textfile']
-    });
+      .subscribe((data: Array<DropZoneResp>) => this.listOfDropZones = data);
   }
 }