diff --git a/npm/ng-packs/packages/core/src/lib/services/list.service.ts b/npm/ng-packs/packages/core/src/lib/services/list.service.ts index 3ebb6dc193..1a1e7c1aeb 100644 --- a/npm/ng-packs/packages/core/src/lib/services/list.service.ts +++ b/npm/ng-packs/packages/core/src/lib/services/list.service.ts @@ -17,6 +17,8 @@ import { LIST_QUERY_DEBOUNCE_TIME } from '../tokens/list.token'; export class ListService implements OnDestroy { private _filter = ''; set filter(value: string) { + if (this._filter !== value) this._page = 0; + this._filter = value; this.get(); } diff --git a/npm/ng-packs/packages/theme-shared/src/lib/directives/ngx-datatable-list.directive.ts b/npm/ng-packs/packages/theme-shared/src/lib/directives/ngx-datatable-list.directive.ts index b721e1142a..7dc81ab6b9 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/directives/ngx-datatable-list.directive.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/directives/ngx-datatable-list.directive.ts @@ -18,6 +18,7 @@ import { Subscription } from 'rxjs'; }) export class NgxDatatableListDirective implements OnChanges, OnDestroy, OnInit { private subscription = new Subscription(); + private querySubscription = new Subscription(); @Input() list: ListService; @@ -66,16 +67,28 @@ export class NgxDatatableListDirective implements OnChanges, OnDestroy, OnInit { this.subscription.add(sub); } + private subscribeToQuery() { + this.querySubscription.add( + this.list.query$.subscribe(() => { + if (this.list.page !== this.table.offset) this.table.offset = this.list.page; + }), + ); + } + ngOnChanges({ list }: SimpleChanges) { if (!list.firstChange) return; const { maxResultCount, page } = list.currentValue; this.table.limit = maxResultCount; this.table.offset = page; + + this.querySubscription.unsubscribe(); + this.subscribeToQuery(); } ngOnDestroy() { this.subscription.unsubscribe(); + this.querySubscription.unsubscribe(); } ngOnInit() {