问题标签 [primeng-datatable]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
1171 浏览

angular - 如何在 PrimeNG 数据表中禁用默认过滤

PrimeNG 数据表有一个选项[filter]="true",可以在用于过滤数据的列标题上启用输入。此外,API 提供了onFilter在过滤数据时触发的回调。

输入为过滤数据提供的输入会导致表对表中的数据运行过滤。在回调中,我重新加载从服务器过滤的数据,这会导致数据被过滤两次。我可以禁用默认过滤,同时让列标题中的输入字段和 onFilter 回调可用吗?

0 投票
0 回答
514 浏览

typescript - Angular2 + PrimeNG - 如何将数据表重置为新的网格结果?

我需要显示特定州的前景网格。为此,我有状态下拉列表。我在网格上还有一个 PrimeNG 全局搜索文本框,它将触发网格列中的搜索。

问题是当我只在文本框中进行搜索时它正在工作,而当我只更改它正在工作的状态下拉值时。当我结合最初提供搜索文本然后更改下拉值时,除非我在文本框中触发事件,否则不会重新绑定网格。

我需要的是,当我更改状态下拉列表时,我想重置文本框并将网格重置为新结果。

这是显示功能的图像。

在此处输入图像描述

0 投票
0 回答
1549 浏览

angular - PrimeNG - 具有单独列选择的数据表

我想要一个具有列内功能的数据表,可以选择在显示的两个值之间进行选择。

就像下面的代码

我希望能够从当前标题和系统为该特定行生成的标题两列中的任何一列中选择值。如果您有这样的选择以及如何完成此操作,请告诉我?

尝试了列选择模式属性,但它不会获得该特定列的实际值。

0 投票
0 回答
1563 浏览

angular - 当数据与惰性绑定时,p-dropdown 过滤器在 p-dataTable 中不起作用

当我使用基本方式将数据绑定到 p-dataTable 时,列的 p-dropdown 过滤器工作正常,但是当我使用绑定 p-dataTable 时[lazy]="true" (onLazyLoad)="loadData($event)",下拉列过滤器不起作用。

工作代码:

不工作代码:

工作代码和不工作代码之间的区别如下

[lazy]="true" (onLazyLoad)="loadData($event)"在 p-dataTable 中绑定在第一行。

0 投票
0 回答
484 浏览

angular - 将 DataTable 的水平样式从 PrimeNG 格式化为垂直样式

我将 PrimeNG beta 17 与 Angular 2 一起使用,并且遇到了一种情况,我想将 DataTable 的水平布局更改为垂直布局,如下所示:

默认情况下:水平数据表布局 在此处输入图像描述

我的要求:垂直数据表布局 垂直数据表布局

那么,任何人都可以提示我使用 PrimeNG esp 的方法吗?使用数据表

谢谢。

0 投票
0 回答
2689 浏览

angular - PrimeNG 数据表。在行中的组中添加新行

我正在使用 PrimeNG Angular2 的数据表控件。我尝试在按某些数据分组的表中添加一个新行。

带有按钮的行组标题。

行添加功能

该字符串被添加但不在组中,而是在数据表的末尾。显然我必须重新绘制表格。但是怎么做呢?据我了解,这个组件应该能够自己完成。如果有人使用此组件,请回复。 数据表组件

0 投票
0 回答
955 浏览

angular - 当 PrimeNG 数据表中的 scrollable=true 时,重新排序不起作用

我正在尝试在我reorderableColumns的.scrollablep-datatable

但似乎它没有按预期工作。当我们尝试拖动列时,它不会移动。如果我们从代码中删除可滚动属性,那么一切都会正常工作。

这是我的在线代码

提前致谢

0 投票
0 回答
3025 浏览

angular - PrimeNG 冻结列不适用于 headerColumnGroup

我正在尝试使用 PrimeNG 将标题列分组与冻结列一起使用。我能够冻结前两列,但未冻结的列在标题中也有冻结的列名。

我从这里引用了代码:-

http://www.primefaces.org/primeng/#/datatable/colgroup http://www.primefaces.org/primeng/#/datatable/scroll

PrimeNG 版本 :- "primeng": "^2.0.0",

在此处输入图像描述 我的组件 html 页面包含:

我的组件文件有:

0 投票
0 回答
1163 浏览

angular - PrimeNG 数据表检查代码中的复选框

如何遍历数据表并检查某些框?我需要在数据表中向客户端显示用户所属的部门,以便客户端可以检查或取消选中行...

提前致谢!

编辑

Reddit 上有人回复说我可以使用双向绑定来做到这一点:
<p-dataTable [value]="cars" selectionMode="multiple" [(selection)]="selectedCars">

并在您的组件中创建一个这样的 selectedCars 数组: selectedCars = [cars[0], cars[5]];

0 投票
0 回答
5288 浏览

angular - AngularJS 2 - Primeng DataTable - 多选,行分组:在运行时为行设置复选框

我在我的 Angular JS 应用程序中使用 PrimeNG Ultima 主题。我有如下所示的数据表,其中包含多项选择和行分组。

我可以看到我的数据表,如下所示。我可以选择单个行,可以选择多行,如果我选中顶部的复选框,我也可以选择所有行。

数据表

我们需要对行进行分组,我也可以这样做。我们的要求是在行组标题中我们需要添加复选框,以便如果用户选中该复选框,则必须选中属于该行组的行。例如,在我的数据表中,我将在 A1 旁边添加复选框。如果选中,则必须选择 ID 为 1 和 5 的两行,但不能选择其他行。

我已经联系了 PrimeNG 团队,他们说现在 p-datatable 将不支持我们想要的。所以我想看看我能做什么。从调试中我注意到每一行都有 p-dtcheckbox 和 ng-reflect-checked 将在检查时为真,否则为假。所以我试图在我的打字稿代码中设置它。谁能告诉我如何做到这一点。 在此处输入图像描述

请在下面查看我的代码

console.log(this.restrictionDT) 效果很好,我可以在浏览器控制台中看到数据表。但是 this.restrictionDT.nativeElement 是未定义的,所以我被卡住了

更新 我做了以下更改,现在可以在我的控制台日志中看到 p-datatable。现在我想为特定行组循环每一行并选择复选框。

解决方案 :

我能够解决这个问题。数据表有一个名为 selection 的属性,它绑定到您的 component.ts 文件中的一个属性,该属性是数组类型。只需将元素添加到您想要选择的那个数组中。就是这么简单。

在您的 component.ts 中执行此操作