5

我的代码中的 ng-grid 有以下设置:

$scope.gridOptions = {
    ...
    useExternalSorting : false,
}

$scope.watch('gridOptions.ngGrid.config.sortInfo', function (oldValue, newValue) {
    console.log(newValue)
})

我也尝试使用sortInfo : undefinedand $watch(gridOptions.sortInfo)。这似乎仅在网格最初加载时才有效。之后,当我单击标题列时,它似乎没有进入$watch. 我尝试在触发排序的回调函数中放置一个调试器,我可以看到代码用正确的信息更新了 sortInfo 数组,但是它似乎没有进入 watch 语句的回调函数中。我的设置有什么不正确的地方吗?我在这里有一个 Plunker,它与我正在尝试做的事情类似。

4

3 回答 3

6

我有同样的问题。我想做自己的服务器端排序,但仍然使用sortInfo单击列标题时更新的对象。在查看控制台中的一些错误后,我发现我必须sortInfo像这样设置一个默认值:

$scope.gridOptions = { ... sortInfo: { fields: [], columns: [], directions: [] }, useExternalSorting: true }

我不确定为什么该columns字段是必需的并且它与文档不匹配。我正在使用 AngularJS v1.2.19 和 ng-grid v2.0.11。不知道为什么要useExternalSorting设置,false但无论哪种方式,您现在都应该可以像这样在该字段上设置手表:

$scope.$watch('gridOptions.sortInfo', function (newVal, oldVal) { console.log(newVal); }, true);

于 2014-10-18T03:16:28.123 回答
4

如果您确实需要查看排序更改,可以使用以下内容:

    //default sorting
    $scope.sortOptions = {
    sortfield: "name",
    sortdir: "DESC"
    };

    //on sorting event fill out sortOptions in scope
    $scope.$on('ngGridEventSorted', function(event, data) {
    $scope.sortOptions.sortfield = data.fields[0];
    $scope.sortOptions.sortdir = data.directions[0];

    });

    //when sortOption changes do something
    $scope.$watch('sortOptions', function(newVal, oldVal) {
    if (newVal !== oldVal) {
      console.log("ngGrid Field: " + $scope.sortOptions.sortfield + " - Direction: " + $scope.sortOptions.sortdir);
    }
    }, true);

它使用排序事件来填写范围内的排序信息,该范围内被监视并在更改时触发。戳这里

或者,不那么复杂,直接在排序事件上触发,让自己免于无聊的观看 8-\

//on sorting event do something
$scope.$on('ngGridEventSorted', function(event, data) {
    console.log("ngGrid Field: " + data.fields[0] + " - Direction: " +data.directions[0]);
}); 

另一个笨蛋

于 2014-06-10T09:10:55.533 回答
1

我的外部排序工作与到目前为止我在这里看到的帖子有点不同。

    $scope.gridOptions = {
                paginationPageSize: 100,
                enableSorting: true,
                useExternalSorting: true,
                enableGridMenu: false,
                enableColumnMenus: false,
                showFooterRow: true,
                enableFiltering: true,
                useExternalPagination: true,
                enableRowSelection: true,
                noUnselect: true,
                multiSelect: false,
                enableRowHeaderSelection: false,
                onRegisterApi: function(gridApi) {
                   $scope.gridApi = gridApi;
                   gridApi.core.on.sortChanged($scope, (grid, sortColumns) => {
                     var sortColumn = sortColumns[0].field;               
                     var sortDirection = sortColumns[0].sort.direction;
                     // then I call a method in my controller which hits my server
                     // side code and returns external sorting through a linq query
                     $scope.UpdateGrid(sortColumn, sortDirection );
                  });
                }, //onRegisterApi
     }; // gridOptions 
于 2016-02-24T15:48:01.743 回答