对包含 Angular 过滤器的 uI 网格列进行排序

Question

我最近开始使用 Angular ui-grid。我不是很了解图书馆的内部结构。

我有一个 ui-grid 列需要显示百分比。所以我将以下过滤器添加到我的 app 并将其与 ui-grid cellFilter 属性.

一起使用

module.filter('percentage', function () {
    return function (input) {
        if (!input) {
            return '';
        } else {
            return input + '%';
        }
    };
})

这工作正常，但在对此列进行排序时。排序工作出乎意料。假设我有 3 行的值为 100,200,300。我希望它只能有两个排序状态 100,200,300 和 300,200,100。但是，如果我继续单击此列的 header，我将获得第三种状态 200, 300, 100 或 100, 300,200。我什至不确定这个状态的模式是什么。

如果我是对的，angular 过滤器仅适用于 views，不会影响字段模型。所以我认为添加 filter 不会对排序产生影响。

除此之外，两个预期的排序（升序、降序）显示完美，唯一的问题是出现第三个。我该如何解决这个问题。

我是否遗漏了任何实现？？请帮我解决这个问题。

编辑：字符串列也会出现此问题。据我了解，就排序而言，只能有一种 ASCENDING 和一种 DESCENDING 状态。但是我得到了更多的安排。

Answer 1

可以使用sortDirectionCycle去掉排序的第三种状态

columnDefs: [
   { field: 'name', sortDirectionCycle: [uiGridConstants.ASC, uiGridConstants.DESC] },
   { field: 'gender', sortDirectionCycle: [uiGridConstants.ASC, uiGridConstants.DESC] },
   { field: 'company', enableSorting: false }
]

从文档中，当单击列标题时，排序方向将循环为升序，然后降序，然后返回未排序。您可以通过设置 sortDirectionCycle columnDef 选项重新排列此循环或跳过其中的一部分。有关详细信息，请查看此 link sortDirectionCycle

对包含 Angular 过滤器的 uI 网格列进行排序

Sorting of uI grid column containing Angular filter

javascript

angularjs

sorting

angular-ui-grid

ui-grid