MatPaginator 在从 MatTableDataSource 中删除行时无法正常工作 [英] MatPaginator not working properly on deleting rows from MatTableDataSource

查看:19
本文介绍了MatPaginator 在从 MatTableDataSource 中删除行时无法正常工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用角度材料创建了一个带有角度 2 选择和分页的表格.

我选择了一个名为删除选定行的按钮来从表中删除选定的行.

但是当删除选定的行时,正在加载所有与为分页指定的值不匹配的表数据.

下面是我的代码的堆栈闪电战链接..

但是当我删除第 3 行时,即使分页值只有 3.. 也正在加载所有行..

谁能告诉我如何使用删除行后指定的分页值来限制我的表行.

解决方案

给你,伙计.

您忘记在删除后将分页器重新分配给数据源.Angular 可能有一些魔法,但有时它需要一点帮助.

我使用超时是因为我总是遇到问题,请在没有它​​的情况下随意尝试.

setTimeout(() => {this.dataSource.paginator = this.paginator;});

I have created a table with selection and pagination in angular 2 using angular material.

I have taken a button with the name Remove Selected Rows to delete the selected rows from the table.

But as a delete the selected rows , all the table data is being loaded which doesn't match with value specified for the pagination.

Below is the stack-blitz link for my code..

https://stackblitz.com/edit/delete-rows-mat-table-vj4hbg?file=app%2Ftable-selection-example.html

Below shown is the output.

Initially the table displays only the rows as specified for the pagination value.

But as I deleted the row 3 , all rows are being loaded even if the pagination value is only 3..

can anybody tell me how can I limit my table rows with the pagination value specified after deleting the rows.

解决方案

Here you go buddy.

You forgot to reassign the paginator to the datasource after deletion. Angular may do some magic, but sometimes it needs a little bit of help.

I use a timeout because I always face an issue, feel free to try without it.

setTimeout(() => {
  this.dataSource.paginator = this.paginator;
});

这篇关于MatPaginator 在从 MatTableDataSource 中删除行时无法正常工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆