C:/GoDev/src/TCSTK-Angular/projects/tibco-tcstk/tc-core-lib/src/lib/components/tibco-cloud-table/tibco-cloud-table-datasource.ts
Data source for the TibcoCloudTable view. This class should encapsulate all logic for fetching and manipulating the displayed data (including sorting, pagination, and filtering).
DataSource
Properties |
Methods |
|
constructor(paginator: MatPaginator, sort: MatSort, d)
|
||||||||||||
Parameters :
|
data |
connect |
connect()
|
Connect this data source to the table. The table will only update when the returned stream emits new items.
Returns :
Observable<any[]>
A stream of the items to be rendered. |
disconnect |
disconnect()
|
Called when the table is being destroyed. Use this function, to clean up any open connections or free any held resources that were set up during connect.
Returns :
void
|
Private getPagedData | ||||||
getPagedData(data: any[])
|
||||||
Paginate the data (client-side). If you're using server-side pagination, this would be replaced by requesting the appropriate data from the server.
Parameters :
Returns :
any
|
Private getSortedData | ||||||
getSortedData(data: any[])
|
||||||
Sort the data (client-side). If you're using server-side sorting, this would be replaced by requesting the appropriate data from the server.
Parameters :
Returns :
any
|
import { DataSource } from '@angular/cdk/collections';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { map } from 'rxjs/operators';
import { Observable, of as observableOf, merge } from 'rxjs';
/**
* Data source for the TibcoCloudTable view. This class should
* encapsulate all logic for fetching and manipulating the displayed data
* (including sorting, pagination, and filtering).
*/
export class TibcoCloudTableDataSource extends DataSource<any> {
data;
constructor(protected paginator: MatPaginator, protected sort: MatSort, protected d) {
super();
this.data = d;
//this._updateChangeSubscription();
}
/**
* Connect this data source to the table. The table will only update when
* the returned stream emits new items.
* @returns A stream of the items to be rendered.
*/
connect(): Observable<any[]> {
// Combine everything that affects the rendered data into one update
// stream for the data-table to consume.
const dataMutations = [
observableOf(this.data),
this.paginator.page,
this.sort.sortChange
];
// Set the paginator's length
this.paginator.length = this.data.length;
return merge(...dataMutations).pipe(map(() => {
return this.getPagedData(this.getSortedData([...this.data]));
}));
}
/**
* Called when the table is being destroyed. Use this function, to clean up
* any open connections or free any held resources that were set up during connect.
*/
disconnect() {}
/**
* Paginate the data (client-side). If you're using server-side pagination,
* this would be replaced by requesting the appropriate data from the server.
*/
private getPagedData(data: any[]) {
const startIndex = this.paginator.pageIndex * this.paginator.pageSize;
return data.splice(startIndex, this.paginator.pageSize);
}
/**
* Sort the data (client-side). If you're using server-side sorting,
* this would be replaced by requesting the appropriate data from the server.
*/
private getSortedData(data: any[]) {
if (!this.sort.active || this.sort.direction === '') {
return data;
}
return data.sort((a, b) => {
const isAsc = this.sort.direction === 'asc';
// console.log('Sort ON: ' + this.sort.active + ' A Has Property: ' + a.hasOwnProperty(this.sort.active) + ' B Has Property: ' + b.hasOwnProperty(this.sort.active) ) ;
if (a.hasOwnProperty(this.sort.active) && b.hasOwnProperty(this.sort.active)) {
return compare(a[this.sort.active], b[this.sort.active], isAsc);
} else {
return 0;
}
});
}
}
/** Simple sort comparator for example ID/Name columns (for client-side sorting). */
function compare(a, b, isAsc) {
return (a < b ? -1 : 1) * (isAsc ? 1 : -1);
}