Question

在重新调整ui-grid中的列大小之后，我需要执行一些操作。我没有在ui-grid中找到任何列重新调整大小的事件。请提供一种在ui-grid中检测列重新大小事件的方法。

Answer 1

首先检查您的enableColumnResizing是否已启用。

enableColumnResizing: true

然后你可能想要使用这样的观察者：

$scope.$watch('gridOptions.$gridScope.isColumnResizing', 
    function (newValue, oldValue) {        
        // do something here        
    });

为此目的创建专用插件并将其作为自定义插件插入您的网格是一种很好的方法。

<强>更新如果以上代码段不起作用：

我刚刚在源代码中找到了以下部分：

var publicApi = {
  events: {
    /**
     * @ngdoc event
     * @name columnSizeChanged
     * @eventOf  ui.grid.resizeColumns.api:PublicApi
     * @description raised when column is resized
     * <pre>
     *      gridApi.colResizable.on.columnSizeChanged(scope,function(colDef, deltaChange){})
     * </pre>
     * @param {object} colDef the column that was resized
     * @param {integer} delta of the column size change
     */
    colResizable: {
      columnSizeChanged: function (colDef, deltaChange) {
      }
    }
  }
};
grid.api.registerEventsFromObject(publicApi.events);

因此，在您的网格选项对象中，它将是：

$scope.gridOptions = {
   enableColumnResizing: true,
   ...,
   onRegisterApi : function(gridApi) {            
     $scope.gridApi = gridApi; 
     $scope.gridApi.colResizable.on.columnSizeChanged($scope, function(colDef, deltaChange) {
       console.log('resized #############'); 
     });            
   }
};

最后在html：

<div ui-grid="gridOptions" ...></div>

以角度ui-grid

1 个答案: