Intégrer tapis table avec AngularFirestore

Question

Je voudrais intégrer la table de tapis-de https://material.angular.io/ avec angularfire2/FireStore https://github.com/angular/angularfire2, une idée, je suis très perdu

mieux ce qui concerne

Answer 1

Voici comment vous le faites pour de simples table.

Dans votre fichier html, mettez ceci.

<mat-table [dataSource]="myData"> 

    <ng-container matColumnDef="name"> 
     <mat-header-cell *matHeaderCellDef>name</mat-header-cell> 
     <mat-cell *matCellDef="let element"> {{element.name}} </mat-cell> 
    </ng-container> 

    <ng-container matColumnDef="description"> 
     <mat-header-cell *matHeaderCellDef>description</mat-header-cell> 
     <mat-cell *matCellDef="let element"> {{element.description}} </mat-cell> 
    </ng-container> 

    <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row> 
    <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row> 

</mat-table> 

Dans votre Javascript mettre ce

import { AngularFirestore} from 'angularfire2/firestore'; 

    export class MyComponent{ 
     displayedColumns = ['name', 'description'];  
     myData; 

     constructor(private afs: AngularFirestore) { 
     this.myData= new MyDataSource(this.afs); 
     } 

    } 

    export class MyDataSource extends DataSource<any> { 
     constructor(private afs: AngularFirestore) { 
     super(); 
     } 
     connect(): Observable<any[]> { 
     return this.afs.collection('products').valueChanges(); 
     } 

     disconnect() { } 
    }