如何以编程方式更新 ui-grid 中的排序指示器? [英] How to update sort-indicators in ui-grid programmatically?

查看:21
本文介绍了如何以编程方式更新 ui-grid 中的排序指示器?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 ui-grid - v3.0.0-rc.22 - 2015-06-15.

I am using ui-grid - v3.0.0-rc.22 - 2015-06-15.

它配置为使用外部排序,效果很好.

It is configured to use external sorting, which works fine.

现在我需要使用选择框从外部更改已排序的列.在选择框的每次更改时,它都会触发外部排序,并且网格中的数据会正确更新.它还更新 gridOptions.columnDefs:它将除正确列之外的所有列的排序对象设置为 undefined 并更新已排序的列.

Now i have the requirement to change the sorted column from outside with a select box. On every change of the select box it fires external sorting and the data in the grid is updated correctly. It also updates the gridOptions.columnDefs: It sets the sort object of all columns except the correct one to undefined and updates the sorted column.

但是有一个问题,当前排序的列指示器(在列标题中)没有按应有的方式更新.

But there is one problem, the current sorted column indicator (in the column header) is not updated as it should be.

我尝试使用 gridApi.core.notifyDataChange() 和选项"或列"作为参数值,但它也不起作用.如何以编程方式更新 ui-grid 中的排序指示器?

I tried using gridApi.core.notifyDataChange() with "options" or"column" as parameter value but it didn't work also. How to update the sort-indicators in ui-grid programmatically?

这里是选择框触发的部分代码:

Here is a part of the code triggered by the select box:

    function updateSortColumn() {
        if ($rootScope.QuickSearch.sortBy !== undefined) {
            $scope.gridOptions.columnDefs.forEach(function (col) {
                if (col.field === $rootScope.QuickSearch.sortBy) {
                    col.sort = {
                        direction:  $rootScope.QuickSearch.sortOrder,
                        priority: 0
                    };
                }
                else
                {
                    col.sort = undefined;
                }
            });
        }
        if($scope.gridApi !== undefined)
        {
            $scope.gridApi.core.notifyDataChange( uiGridConstants.dataChange.OPTIONS );
            $scope.gridApi.core.notifyDataChange( uiGridConstants.dataChange.COLUMN );
        }
    }

推荐答案

你可以使用 ui-grid 的 "sortColumn" 函数,像这样:

You could use the function "sortColumn" of the ui-grid, like this:

$scope.gridApi.grid.sortColumn(column, directionOrAdd, add)

这里是这个函数的源代码:ui-grid 源代码

here is the source code of this function : ui-grid source code

在你的例子中它会给出这样的东西:

in your example it will give somthing like this :

 function updateSortColumn() {
        if ($rootScope.QuickSearch.sortBy !== undefined) {
            $scope.gridOptions.columnDefs.forEach(function (col) {
                if (col.field === $rootScope.QuickSearch.sortBy) {
                    $scope.gridApi.grid.sortColumn(col,$rootScope.QuickSearch.sortOrder);
                }
            });
        }
    }

$rootScope.QuickSearch.sortOrder 必须在 (uiGridConstants.ASC|uiGridConstants.DESC) 中.您不必提供.

$rootScope.QuickSearch.sortOrder must be in (uiGridConstants.ASC|uiGridConstants.DESC). You do not have to provide it.

这篇关于如何以编程方式更新 ui-grid 中的排序指示器?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆