sandovalgus
1/8/2019 - 10:35 PM

driver-list.html


<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();
  }
}