README
Reactive Datasource
This library provides an abstract ReactiveDataSource
and MatDataSource
classes to build custom datasources on Angular.
You can pass it to a Material Table:
<mat-datasource [dataSource]="source">
<mat-table [dataSource]="source">
...
</mat-table>
<footer [attr.hidden]="source.total <= source.pageSize ? '' : null">
<mat-paginator
[length]="source.total"
[pageSize]="source.pageSize"
></mat-paginator>
</footer>
</mat-datasource>
Or consume it via the dataSource
pipe:
<ng-container *ngIf="source | dataSource as items">
<mat-nav-list>
<mat-list-item *ngFor="let item of items">
...
</mat-list-item>
</mat-nav-list>
</ng-container>
Demo
An example of how it can work with a Firebase backend it's here:
https://stackblitz.com/edit/matdatasource
And the concepts behind are explained here:
https://medium.com/@matheo/reactive-datasource-for-angular-1d869b0155f6