1

我得到了一个简单的表格，我在其中实现了过滤选项，local_part一切正常，直到我在最后一页上的例子中不尝试搜索表格。如果我在第一页上，我可以找到所有内容，但是当我例如在第 20 页上搜索时，我得到了空白行（并且分页显示我只有一页（所以这是正确的）当我点击我的分页时 [1 ] 然后我看到过滤后的数据）

对于我正在使用ngx-filter-pipe的过滤和分页ngx-pagination

我对搜索表的输入

<input class="form-control form-control-alternative" placeholder="Szukaj aliasu" type="text [(ngModel)]="queryString.local_part">

我的表格行

<tr *ngFor="let aliases of alias | filterBy: queryString | paginate: { itemsPerPage: 10, currentPage: p }; let i = index">

我的分页控件

<pagination-controls 
  (pageChange)="p = $event" 
  directionLinks="true" 
  autoHide="false"
  responsive="true" 
  previousLabel="Prev" 
  nextLabel="Next">
</pagination-controls>

应该如何？无论我在哪个页面上，我都想过滤我的表格。

4

1 回答 1

0

这可能不是最终解决方案，但在我的项目中，我创建了一个自定义对象作为“配置”，用于将分页属性声明为一种解决方法：

this.config = {
  itemsPerPage: 6,
  currentPage: 1,
};

现在在 HTML 中更改如下：

*ngFor="let service of services | filter:searchText | paginate: config"

在搜索栏的输入上只需添加点击事件，如下所示：

(click)="config.currentPage = 1"

它看起来像这样：

<input matInput (click)="config.currentPage = 1" placeholder="Ex. City Data" #input [(ngModel)]="searchText">

这解决了我的问题。

于 2021-02-23T08:07:02.420 回答