Primeng: Lazy Loading looping issue

[davisruk]

I'm submitting a ... (check one with "x")

[ X] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Current behavior

DataTable with Pagination, LazyLoading and Filter enabled spawns infinite onLazyLoad callbacks when a filter has a value, there is more than one page and the user clicks a page number. Callback initially requests the correct page of data but all other callbacks request page 1.
The reason for this is that the DataTable ngDoCheck function is incorrectly setting lazyFilteredByUser to false when lazyloading is enabled and the filter has a value. In lazy loading mode the application is responsible for filtering and retrieving the correct data for the requested page. Current code is below; further posts on the PrimeNG forum:
http://forum.primefaces.org/viewtopic.php?f=35&t=48297&sid=bae2acdf7ca3c456a85c8fc5bccc7ca6
DataTable.prototype.ngDoCheck = function () { var changes = this.differ.diff(this.value); if (changes) { this.dataChanged = true; if (this.paginator) { this.updatePaginator(); } if (this.hasFilter()) { if (this.lazy) { //prevent loop if (this.lazyFilteredByUser) this.lazyFilteredByUser = false; else this.filter(); } else { this.filter(); } } if (this.stopSortPropagation) { this.stopSortPropagation = false; } else if (!this.lazy && (this.sortField || this.multiSortMeta)) { if (this.sortMode == 'single') this.sortSingle(); else if (this.sortMode == 'multiple') this.sortMultiple(); } this.updateDataToRender(this.filteredValue || this.value); } };
Expected behavior

The filtering should be the responsibility of the application for lazy loading. Changing NgDoCheck to the following produces the expected behaviour:
DataTable.prototype.ngDoCheck = function () { var changes = this.differ.diff(this.value); if (changes) { this.dataChanged = true; if (this.paginator) { this.updatePaginator(); } if (this.hasFilter()) { if (this.lazy) { //prevent loop this.lazyFilteredByUser = true; } else { this.filter(); } } if (this.stopSortPropagation) { this.stopSortPropagation = false; } else if (!this.lazy && (this.sortField || this.multiSortMeta)) { if (this.sortMode == 'single') this.sortSingle(); else if (this.sortMode == 'multiple') this.sortMultiple(); } this.updateDataToRender(this.filteredValue || this.value); } };
Minimal reproduction of the problem with instructions

Create a DataTable with LazyLoad, Pagination and Filters. Give the DataTable a data set that requires more than 1 page. Filter the data such that the result set requires more than one page. Select any page other than the first.
What is the motivation / use case for changing the behavior?

The component is bugged and not behaving correctly.
Please tell us about your environment:

Windows 10 & 7, VS Code, NPM, lite-server

• Angular version: 2.0.X
  
  2.2.3 (Angular core etc)
• PrimeNG version: 2.0.X
  
  1.0.0 Final
• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
  
  all
• Language: [all | TypeScript X.X | ES6/7 | ES5]
  all
• Node (for AoT issues): node --version =
  4.6.0

[jncalderon]

hello how can get solution for this error? looping in lazyLoad, regards!

[Samisama]

@shinigammi update to version 2.0.0-rc.1 should fix the problem

[shajeeck]

I have this same issue, filter with lazy loading on data table is looping the lazyload call after once data is repopulated

primeng - 4.0.0 rc2
angular - 4.0.0

[dan-madaket]

I'm having this problem in primeng 4.0.0-rc.2 as well.

Any recommended tweaks I can make to alleviate the issue while we wait for a fix?