Fatal编程技术网
  • javascript/
  • Javascript 如何在列更改位置时获取事件？

Javascript 如何在列更改位置时获取事件？

javascript angularjs

Javascript 如何在列更改位置时获取事件？,javascript,angularjs,angularjs-directive,angularjs-scope,angular-ui-grid,Javascript,Angularjs,Angularjs Directive,Angularjs Scope,Angular Ui Grid,我使用的是UI网格。因为我使用的是从此处开始的列移动功能。 使用该用户可以更改网格列位置。当它成功更改列位置时，我需要一个事件。 我想在更改列的位置后显示一个警报。换句话说，我想在成功删除列时添加回调函数 这是我的密码 我想在列位置更改后显示警报 <!doctype html> <html ng-app="app"> <head> <script src="http://ajax.googleapis.com/ajax/libs/angula

我使用的是UI网格。因为我使用的是从此处开始的列移动功能。 使用该用户可以更改网格列位置。当它成功更改列位置时，我需要一个事件。 我想在更改列的位置后显示一个警报。换句话说，我想在成功删除列时添加回调函数

这是我的密码 我想在列位置更改后显示警报

<!doctype html>
<html ng-app="app">
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-touch.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-animate.js"></script>
    <script src="http://ui-grid.info/docs/grunt-scripts/csv.js"></script>
    <script src="http://ui-grid.info/docs/grunt-scripts/pdfmake.js"></script>
    <script src="http://ui-grid.info/docs/grunt-scripts/vfs_fonts.js"></script>
    <script src="http://ui-grid.info/release/ui-grid.js"></script>
    <link rel="stylesheet" href="http://ui-grid.info/release/ui-grid.css" type="text/css">
    <link rel="stylesheet" href="main.css" type="text/css">
  </head>
  <body>

<div ng-controller="MainCtrl">
<div class="grid" ui-grid="gridOptions" ui-grid-move-columns></div>
</div>


    <script src="app.js"></script>
  </body>
</html>
您可以使用API：

gridApi.colMovable.on.columnPositionChanged（作用域、函数（colDef、originalPosition、newPosition）{}

添加以下代码段：

  $scope.gridOptions.onRegisterApi = function(gridApi) {
gridApi.colMovable.on.columnPositionChanged($scope,function(colDef, originalPosition, newPosition){
  alert('test');
})
})

使用以下代码处理列更改事件

$scope.gridOptions.onRegisterApi = function (gridApi) {
        $scope.gridApi = gridApi;
        $scope.gridApi.colMovable.on.columnPositionChanged();

      };
使用“ui网格移动列”指令处理列移动事件

<div class="grid" ui-grid="gridOptions" ui-grid-move-columns></div>