如何在Ag-grid中使排序键不敏感? [英] How to make sorting key insensitive in ag-grid?
问题描述
我正在某些网格中工作,我注意到所有网格上的排序都是关键敏感的,是否有任何方法可以更改它。这是我代码的一部分。
I am working in some grids and I notice that the sorting on all of them is key sensitive is there any way to change that. This is a part of my code.
columnDefs = [
{
headerName: 'Id', field: 'id', sort: 'asc', sortable: true, filter: true,
checkboxSelection: true, resizable: true,
},
{
headerName: 'Name', field: 'name', sortable: true, filter: true,
checkboxSelection: false, editable: true, resizable: true,
},
{
headerName: 'Description', field: 'description', sortable: true, filter: true,
checkboxSelection: false, editable: true, resizable: true,
},
];
感谢您提供的任何可能的帮助。
Thank you for any possible given help.
这就是我通过## wentjun ##实现解决方案的方式:
This is how i have implement the solution by ##wentjun##:
constructor(private dialog: MatDialog, private adminService: AdminService) {}
columnDefs = [
{
headerName: 'Id', field: 'id', sortable: true, filter: true,
checkboxSelection: true, resizable: true,
},
{
headerName: 'Name', field: 'name', sortable: true, filter: true,
checkboxSelection: false, editable: true, resizable: true,
comparator: this.customComparator,
},
{
headerName: 'Description', field: 'description', sortable: true, filter: true,
checkboxSelection: false, editable: true, resizable: true,
},
];
customComparator(valueA, valueB) {
return valueA.toLowerCase().localeCompare(valueB.toLowerCase());
}
推荐答案
这可以通过使用需要特定列的自定义排序功能不区分大小写的排序。
This can be done by using a custom sorting function on the particular column that requires case-insensitive sorting.
例如,对于您的 columnDefs
,如果需要名称
列要进行大小写排序,我们将 customComparator
传递为 comparator
属性的值。在您的ngOnInit中,
For instance, for your columnDefs
, if you require the name
column to be sorted case insentitve, we pass the customComparator
as the value for the comparator
property. In your ngOnInit,
this.columnDefs = [
{
headerName: 'Name',
field: 'name',
sort: 'asc', // optional, allows grid column to be sorted on init
comparator: customComparator
},
// other columns
];
然后,我们定义customComparator使其执行区分大小写的排序。我们通过在自定义比较器上将值转换为小写来实现。
Then, we define the customComparator such that it carries out case-insentitive sorting. We do so by converting the values to lowercase on the custom comparator.
const customComparator = (valueA, valueB) => {
return valueA.toLowerCase().localeCompare(valueB.toLowerCase());
};
编辑:我分叉并重新创建了演示,以演示上述比较器的用法。有关相关详细信息,请参见constructor()方法。
I have forked and recreated a demo from the original ag-grid demo to demonstrate the usage of the above comparator. Refer to the constructor() method for the relevant details.
这篇关于如何在Ag-grid中使排序键不敏感?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!