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

installation de Angular Material

Browse Source
This commit is contained in:
Sébastien André
2019-10-10 10:48:57 +02:00
parent 436b9fd6a7
commit e2baa1486a
12 changed files with 113 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
Front/skydivelogs-app/src/app/app.module.ts
View File

@@ -14,6 +14,9 @@ import { ListOfJumpTypesComponent } from './list-of-jump-types/list-of-jump-type
import { ServiceApi } from '../services/serviceApi';
import { ServiceComm } from '../services/serviceComm';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatTableModule } from '@angular/material/table';
const appRoutes: Routes = [
@@ -42,6 +45,9 @@ const appRoutes: Routes = [
{ enableTracing: true } // <-- debugging purposes only
),
BrowserModule,
BrowserAnimationsModule,
MatPaginatorModule,
MatTableModule
],
exports: [HttpClientModule],
providers: [ServiceApi, ServiceComm],

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

@@ -2,22 +2,15 @@
list-of-dzs works!
</p>
<!-- <table>
<tr *ngFor="let dropZone of this.listOfDropZones; index as i;">
<td>{{ dropZone.id }}</td>
<td>{{ dropZone.name }}</td>
</tr>
</table> -->
<table mat-table [dataSource]="listOfDropZones">
<table mat-table [dataSource]="listOfDropZones" class="mat-elevation-z8">
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef> ID </th>
<td mat-cell *matCellDef="let element"> {{element.id}} </td>
<th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">{{element.id}}</td>
</ng-container>
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef> Name </th>
<td mat-cell *matCellDef="let element"> {{element.name}} </td>
<th mat-header-cell *matHeaderCellDef>Name</th>
<td mat-cell *matCellDef="let element">{{element.name}}</td>
</ng-container>
</table>
<mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>

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

@@ -1,6 +1,4 @@
import { Component, OnInit, Injectable } from '@angular/core';
import { MatPaginator } from '@angular/material/paginator';
import { MatTableDataSource } from '@angular/material/table';
import { DropZoneResp } from '../../models/dropzone';
import { ServiceApi } from '../../services/serviceApi';

2
Front/skydivelogs-app/src/app/list-of-jumps/list-of-jumps.component.ts
View File

@@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { JumpResp } from '../../models/jump';
import { ServiceApi } from '../../services/serviceApi';
import { ServiceComm } from '../../services/serviceComm';

2
Front/skydivelogs-app/src/index.html
View File

@@ -7,6 +7,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<body>
<app-root></app-root>

1
Front/skydivelogs-app/src/main.ts
View File

@@ -1,3 +1,4 @@
import 'hammerjs';
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

2
Front/skydivelogs-app/src/services/serviceApi.ts
View File

@@ -1,6 +1,6 @@
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { DropZoneResp } from '../models/dropzone';

2
Front/skydivelogs-app/src/services/serviceComm.ts
View File

@@ -1,5 +1,5 @@
import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
import { BehaviorSubject } from 'rxjs';
@Injectable()
export class ServiceComm {

3
Front/skydivelogs-app/src/styles.css
View File

@@ -1 +1,4 @@
/* You can add global styles to this file, and also import other style files */
html, body { height: 100%; }
body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }