p-dataTable does not render when multiSortMeta is set #1663
Labels
Type: Bug
Issue contains a bug related to a specific component. Something about the component is not working
Milestone
I'm submitting a ... (check one with "x")
Plunkr Case (Bug Reports)
Yesterday the table was broken so couldn't add a plunker for the bug. But now here is the plunker that shows the p-table throws find error as described below.
http://plnkr.co/edit/43HqrN?p=preview
Current behavior
addition of [multiSortMeta] to my table causes primeng below error.
If I don't set the multiSortMeta the table renders correctly but without the default sorts applied to the table.
Error:
EXCEPTION: Error in ./TableComponent class TableComponent - inline template:5:2 caused by: # Cannot read property 'find' of undefined ErrorHandler.handleError @ error_handler.js:51 next @ application_ref.js:373 schedulerFn @ async.js:98 SafeSubscriber.__tryOrUnsub @ Subscriber.js:223 SafeSubscriber.next @ Subscriber.js:172 Subscriber._next @ Subscriber.js:125 Subscriber.next @ Subscriber.js:89 Subject.next @ Subject.js:55 EventEmitter.emit @ async.js:84 NgZone.triggerError @ ng_zone.js:331 onHandleError @ ng_zone.js:292 ZoneDelegate.handleError @ zone.js:246 Zone.runTask @ zone.js:154 ZoneTask.invoke @ zone.js:345 error_handler.js:53 ORIGINAL EXCEPTION: Cannot read property 'find' of undefined ErrorHandler.handleError @ error_handler.js:53 next @ application_ref.js:373 schedulerFn @ async.js:98 SafeSubscriber.__tryOrUnsub @ Subscriber.js:223 SafeSubscriber.next @ Subscriber.js:172 Subscriber._next @ Subscriber.js:125 Subscriber.next @ Subscriber.js:89 Subject.next @ Subject.js:55 EventEmitter.emit @ async.js:84 NgZone.triggerError @ ng_zone.js:331 onHandleError @ ng_zone.js:292 ZoneDelegate.handleError @ zone.js:246 Zone.runTask @ zone.js:154 ZoneTask.invoke @ zone.js:345 error_handler.js:56 ORIGINAL STACKTRACE: ErrorHandler.handleError @ error_handler.js:56 next @ application_ref.js:373 schedulerFn @ async.js:98 SafeSubscriber.__tryOrUnsub @ Subscriber.js:223 SafeSubscriber.next @ Subscriber.js:172 Subscriber._next @ Subscriber.js:125 Subscriber.next @ Subscriber.js:89 Subject.next @ Subject.js:55 EventEmitter.emit @ async.js:84 NgZone.triggerError @ ng_zone.js:331 onHandleError @ ng_zone.js:292 ZoneDelegate.handleError @ zone.js:246 Zone.runTask @ zone.js:154 ZoneTask.invoke @ zone.js:345 error_handler.js:57 TypeError: Cannot read property 'find' of undefined at DataTable.ngDoCheck (datatable.js:285) at Wrapper_DataTable.ngDoCheck (wrapper.ngfactory.js:516) at View_TableComponent1.detectChangesInternal (component.ngfactory.js:406) at View_TableComponent1.AppView.detectChanges (view.js:438) at View_TableComponent1.DebugAppView.detectChanges (view.js:633) at ViewContainer.detectChangesInNestedViews (view_container.js:71) at CompiledTemplate.proxyViewClass.View_TableComponent0.detectChangesInternal (component.ngfactory.js:98) at CompiledTemplate.proxyViewClass.AppView.detectChanges (view.js:438) at CompiledTemplate.proxyViewClass.DebugAppView.detectChanges (view.js:633) at CompiledTemplate.proxyViewClass.AppView.internalDetectChanges (view.js:423) at View_BlockComponent2.detectChangesInternal (component.ngfactory.js:284) at View_BlockComponent2.AppView.detectChanges (view.js:438) at View_BlockComponent2.DebugAppView.detectChanges (view.js:633) at ViewContainer.detectChangesInNestedViews (view_container.js:71) at CompiledTemplate.proxyViewClass.View_BlockComponent0.detectChangesInternal (component.ngfactory.js:138)
I tracked down the error to a change in primeng table code as below:
working version (previous version of PrimeNg):
else if(!this.lazy && (this.sortField||this.multiSortMeta)) { if(this.sortMode == 'single') this.sortSingle(); else if(this.sortMode == 'multiple') this.sortMultiple(); }
Not working version:
`
else if(!this.lazy && (this.sortField||this.multiSortMeta)) {
if(!this.sortColumn) {
this.sortColumn = this.columns.find(col => col.field === this.sortField && col.sortable === 'custom');
}
`
Based on the error received it appears this.cloumns is not defined and find could not apply on it at this point.
Expected behavior
Primeng 1.0.0 was working and applying the metaSort highlighted to the corresponding fields.
Minimal reproduction of the problem with instructions
Here is my table component structure:
<p-dataTable #table [exportFilename]="description" [value]="filterData$ | async" sortMode="multiple" [multiSortMeta]="defaultSortOrders" [globalFilter]="gb" [selectionMode]="selected" [(selection)]="selectedRow" (onRowSelect)="onRowSelect($event)" [rows]="rowsPerPageOptions[0]" [paginator]="(filterData$ | async)?.length > rowsPerPageOptions[0] ? true: false" [pageLinks]="5" [rowsPerPageOptions]="rowsPerPageOptions" paginatorPosition="top"> </p-dataTable>
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
Windows 10
Language: TypeScript [all | TypeScript X.X | ES6/7 | ES5]
Node (for AoT issues):
node --version
=The text was updated successfully, but these errors were encountered: