Give custom file name to p-table export

I am using primeng table in my angular application. I'm trying to assign append the export csv file with the current time when the user exports the table content. However the first time I export, the file name is not getting updated with time. The next time it works but the filename is appended with the previous time. My guess is that the export filename is using the older filename & not the updated one. Don't know why that's happening. I'm calling the setFile method when I do the export. It should take the updated file name. Please help.Thanks in advance.

Here is my template code:

<p-table [columns]="cols" #dt [value]="students" [autoLayout]="true" exportFilename={{testFileName}}>
<ng-template pTemplate="caption">
<div >
<button mat-icon-button type="button" (click)="setFileName();dt.exportCSV()" style="float:right"><mat-icon>save_alt</mat-icon></button>
</div>
</ng-template>
</p-table>


My typescript:

students: any[];
cols: any[];

testFileName = 'SampleFile';
constructor(private studentService: StudentService) { }

ngOnInit() {
this.studentService.getAllStudents().subscribe(data => this.students = data);

this.cols = [
{ field: 'name', header: 'Name' },
{ field: 'rollNo', header: 'RollNo' },
{ field: 'class', header: 'Class' },
];
}



setFileName() {
this.testFileName = 'StudentDetailsExport' + '_' +
new DatePipe('en-US').transform(Date.now(), 'MMM_dd_yyyy_hh_mm_ss', 'UTC') + 'Z';

}

Continue reading...