In my app, I have a button that prints a list when it's clicked. Right now, it can print the whole list, but I want it to print the filtered value. I declared the list in another component (child component) and the filter operation is also inside that component too. Here is my code, how can I achieve what I want?
Main TS:
@ViewChild(TabWarehouseDetailComponent, { static: false }) child;
printList() {
let source: IEnvironmentTransactionSummary[] = [];
source = this.child.EnvironmentTransactions;
if (
source && source.length > 0
) {
const dialogRef = this._dialog.open(CommonDailogComponent, {
width: "400px",
});
dialogRef.afterClosed().subscribe((result) => {
if (result) {
let screenReport: IScreenReport = {
CaptionEN: "RoomActivityList",
Column1HeaderName: "Transaction Date",
Column2HeaderName: "Type",
Column3HeaderName: "Batch No",
};
screenReport.ScreenReportItems = [];
source.forEach((x) => {
screenReport.ScreenReportItems.push({
Column1Value: x.TransactionDate != null ? new Date(x.TransactionDate.toString()).toLocaleDateString("en-GB") : "",
Column2Value: x.CellTransactionType.Name,
Column3Value: x.BatchNo,
});
});
screenReport.ExportType = { Id: +result };
this._commonService
.saveGetListScreenReport(screenReport)
.subscribe((response: IAttachment) => {
this.pdfReport = response;
this.downloadFile(this.pdfReport);
this._messages.Show(
"Printed",
"SUCCESS",
3
);
});
}
});
}
else {
this._messages.Show(
"There is nothing inside the list!",
"WARNING",
3
);
}
}
Child TS:
private _environmentTransactions: IEnvironmentTransactionSummary[];
@Input()
set EnvironmentTransactions(prm: IEnvironmentTransactionSummary[]) {
if (prm != this._environmentTransactions) {
this._environmentTransactions = prm;
this.dataSource = new MatTableDataSource(prm);
}
}
get EnvironmentTransactions(): IEnvironmentTransactionSummary[] {
return this._environmentTransactions;
}
applyFilterEnviroment(filterValue: string) {
this.dataSource.filter = filterValue.trim().toLocaleLowerCase();
if (this.dataSource.paginator) {
this.dataSource.paginator.firstPage();
}
}