时间戳

首页 > 解决方案 > Datagrid 排序号 - 最后希望为空

vmware-clarity - Datagrid 排序号 - 最后希望为空

问题描述

有没有什么方法可以在数据网格列上设置排序，该列是数字但可以为空，这样如果用户对列表进行排序，它总是最后显示空，即 asc 将是 1,2,3，null desc 将是 3,2 ,1,空

很有用，因为许多行将具有空值，如果单击排序，则用户将专注于查看您按上述排序的信息。

标签： vmware-clarity

解决方案

列可以具有应用程序提供的自定义排序功能。

我将列出一个概述，然后留下一个指向工作应用程序的 stackblitz 链接，以便您可以参考工作代码。

首先，CustomComparator为应用程序定义一个消费：

import {ClrDatagridComparatorInterface} from "@clr/angular";

class CustomComparator implements ClrDatagridComparatorInterface<any> {
    compare(a: any, b: any) {
      if (a.key && b.key) {
        return a.key - b.key;
      } else {
        return null;
      }
    }
}

接下来，将比较器声明为具有数据网格的组件中的公共实体

public customComparator = new CustomComparator();

最后，更新模板以声明在需要它的列上使用自定义比较器：

<clr-dg-column [clrDgField]="'key'"
  [clrDgSortBy]="customComparator">
    Key
</clr-dg-column>

这是一个堆栈闪电战的链接，其中植入了一个自定义比较器，该比较器总是最后返回空项目。https://stackblitz.com/edit/so-58020609-custom-sorting

推荐阅读