这是我想出来的.我找不到一个单一的事件,为网格状态的变化,但它看起来像他们有几乎所有的事件.这是我正在使用的几个.我只是在onRegisterApi回调中设置一个断点,并通过gridApi对象挖掘来查找事件.
http://plnkr.co/edit/LAMZvOkpx6jsD4CWSz04?p=preview
原文链接:https://www.f2er.com/angularjs/140715.htmlHTML:
<div ui-grid="gridOptions" ui-grid-selection ui-grid-resize-columns ui-grid-auto-resize ui-grid-move-columns ui-grid-grouping ui-grid-save-state> </div>
JS:
$scope.gridOptions = { data: [ { name: 'Jack',title: 'manager',phone: '123456789',location: 'india'},{ name: 'Suzy',title: 'developer',phone: '465189798',location: 'usa'},{ name: 'George',title: 'secretary',phone: '82656517',location: 'japan'},{ name: 'Michael',title: 'analyst',phone: '31321687',location: 'egypt'},{ name: 'Sara',title: 'consultant',phone: '59595847',location: 'germany'},{ name: 'Chris',title: 'engineer',phone: '789456123',location: 'russia'},{ name: 'Elizabeth',title: 'clerk',phone: '963852741',location: 'china'},{ name: 'Jane',title: 'intern',phone: '147258369',location: 'australia'},{ name: 'Bill',title: 'accountant',phone: '951487623',location: 'brazil'} ],columnDefs: [ { name: 'name' },{ name: 'title' },{ name: 'phone' },{ name: 'location' } ],enableGridMenu: true,enableRowSelection: true,enableRowHeaderSelection: false,enableColumnResizing: true,enableColumnReordering: true,enableFiltering: true,onRegisterApi: function(gridApi) { // Keep a reference to the gridApi. $scope.gridApi = gridApi; // Setup events so we're notified when grid state changes. $scope.gridApi.colMovable.on.columnPositionChanged($scope,saveState); $scope.gridApi.colResizable.on.columnSizeChanged($scope,saveState); $scope.gridApi.grouping.on.aggregationChanged($scope,saveState); $scope.gridApi.grouping.on.groupingChanged($scope,saveState); $scope.gridApi.core.on.columnVisibilityChanged($scope,saveState); $scope.gridApi.core.on.filterChanged($scope,saveState); $scope.gridApi.core.on.sortChanged($scope,saveState); // Restore prevIoUsly saved state. restoreState(); } }; function saveState() { var state = $scope.gridApi.saveState.save(); localStorageService.set('gridState',state); } function restoreState() { $timeout(function() { var state = localStorageService.get('gridState'); if (state) $scope.gridApi.saveState.restore($scope,state); }); }