<table mat-table [dataSource]="dataSource" class="mat-elevation-z8 tableDriver">
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef> Name </th>
<td mat-cell *matCellDef="let element"> {{ element.name }} </td>
</ng-container>
<ng-container matColumnDef="lastName">
<th mat-header-cell *matHeaderCellDef> lastName </th>
<td mat-cell *matCellDef="let element"> {{element.lastName}} </td>
</ng-container>
<ng-container matColumnDef="licence">
<th mat-header-cell *matHeaderCellDef> Licence </th>
<td mat-cell *matCellDef="let element"> {{element.licence}} </td>
</ng-container>
<ng-container matColumnDef="state">
<th mat-header-cell *matHeaderCellDef> State </th>
<td mat-cell *matCellDef="let element"> {{element.state}} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;" (click)="onRowClicked(row)"></tr>
</table>
<mat-paginator #paginator [pageSize]="10" [pageSizeOptions]="[5, 10, 20]">
</mat-paginator>
import { Component, OnInit } from '@angular/core';
import { DriverService } from '../../services/driver.service';
import { Driver } from '../driver.model';
@Component({
selector: 'app-driver-list',
templateUrl: './driver-list.component.html',
styleUrls: ['./driver-list.component.css']
})
export class DriverListComponent implements OnInit {
public choferes: Array<any>= [];
displayedColumns: string[] = [ 'name', 'lastName', 'licence', 'state'];
datasource: Driver[] = [];
constructor(private serviceDriver: DriverService) { }
ngOnInit() {
this.serviceDriver.getsDdrivers().subscribe(data => {
this.choferes = data;
this.datasource = this.choferes;
console.log(this.choferes);
});
}
}
import { Injectable } from '@angular/core';
import { AngularFirestore, AngularFirestoreDocument } from 'angularfire2/firestore';
import { Driver } from '../driver/driver.model';
import { Observable } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class DriverService {
ejemplo: Driver [];
constructor(private afs: AngularFirestore) { }
getsDdrivers(){
return this.afs.collection('Drivers').snapshotChanges();
}
}