sandre/SkydiveLogs
0
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Affichage en tableau pour les autres pages

Browse Source
This commit is contained in:
Sébastien André
2019-10-10 15:00:52 +02:00
parent a29626cd51
commit ed37fb01c9
8 changed files with 73 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
Front/skydivelogs-app/src/app/list-of-aircrafts/list-of-aircrafts.component.html
View File

@@ -1,10 +1,15 @@
<p>
list-of-aircrafts works!
</p>
<table mat-table [dataSource]="dataSourceTable">
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">{{element.id}}</td>
</ng-container>
<table>
<tr *ngFor="let aircraft of this.listOfAircrafts; index as i;">
<td>{{ aircraft.id }}</td>
<td>{{ aircraft.name }}</td>
</tr>
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>Name</th>
<td mat-cell *matCellDef="let element">{{element.name}}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<mat-paginator [pageSize]="10" [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>

14
Front/skydivelogs-app/src/app/list-of-aircrafts/list-of-aircrafts.component.ts
View File

@@ -1,4 +1,7 @@
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, ViewChild } from '@angular/core';
import { MatPaginator } from '@angular/material/paginator';
import { MatTableDataSource } from '@angular/material/table';
import { AircraftResp } from '../../models/aircraft';
import { ServiceApi } from '../../services/serviceApi';
import { ServiceComm } from '../../services/serviceComm';
@@ -10,6 +13,9 @@ import { ServiceComm } from '../../services/serviceComm';
})
export class ListOfAircraftsComponent implements OnInit {
public listOfAircrafts: Array<AircraftResp> = new Array<AircraftResp>();
public displayedColumns: Array<string> = ['id', 'name'];
public dataSourceTable = new MatTableDataSource<AircraftResp>();
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
constructor(private serviceApi: ServiceApi, private serviceComm: ServiceComm) {
}
@@ -21,6 +27,10 @@ export class ListOfAircraftsComponent implements OnInit {
getListOfAircrafts() {
this.serviceApi.getListOfAircrafts()
.subscribe(data => this.listOfAircrafts = data);
.subscribe(data => {
this.listOfAircrafts = data;
this.dataSourceTable = new MatTableDataSource<AircraftResp>(data);
this.dataSourceTable.paginator = this.paginator;
});
}
}