无法从 IgniteUI / igniteui-angular 网格获取排序事件

如何解决无法从 IgniteUI / igniteui-angular 网格获取排序事件

我需要在网格上应用字母数字排序，但无法从网格中获取排序事件。

解决方法

可以使用三个事件发射器，topic 在主题上。

sorting - 在应用排序表达式之前发出
sortingDone - 排序完成后发出
sortingExpressionsChange - 在执行排序之前发出

使用 DefaultSortingStrategy 算法进行排序。任何 IgxColumnCOmponent 或 ISortingExpression 都可以使用 ISortingStrategy 的自定义实现。

您可以通过扩展默认排序策略或通过实现 ISortingStrategy 来定义自己的排序策略：

CustomSortingStrategy 示例

export class CustomSortingStrategy extends DefaultSortingStrategy {
...
}

...
const strategy = CustomSortingStrategy.instance();

grid.sort({fieldName: 'Name',dir: SortingDirection.Asc,ignoreCase: true,strategy: CustomSortingStrategy.instance()});

ISortingStrategy 实现示例：


export class SortByParityComponent implements ISortingStrategy {
    public sort(data: any[],fieldName: string,dir: SortingDirection) {
        const key = fieldName;
        const reverse = (dir === SortingDirection.Desc ? -1 : 1);
        const cmpFunc = (obj1,obj2) => this.compareObjects(obj1,obj2,key,reverse);
        return data.sort(cmpFunc);
    }
    protected sortByParity(a: any,b: any) {
        return a % 2 === 0 ? -1 : b % 2 === 0 ? 1 : 0;
    }
    protected compareObjects(obj1,key: string,reverse: number) {
        const a = obj1[key];
        const b = obj2[key];
        return reverse * this.sortByParity(a,b);
    }
}
...

grid.sort({
    fieldName: 'ID',dir: SortingDirection.Desc,ignoreCase: false,strategy: new SortByParityComponent()
});

Here you can find a working sample with CustomSortingStrategy。